先看个栗子？
塔塔，这就是 hhScroll 。
请相信你见到它的第一感觉，我们倾注了很多时间打磨这些界面：边框、圆角、阴影、切换控制器、切换指示器，如果你喜欢这些精致贴心的细节，那么接下来它会给你更多惊喜，如果你不喜欢，（...）。
HTML
Step 1：下载好 hhScrroll 之后，你会在 build 文件夹中看到插件所需的所有文件（图片、样式表、JS），需要提示的是，这些图片必须放在你网站目录的 image 文件夹下，若没有，请新建。
Step 2：新建一个页面，然后导入 jQuery、hhScroll 样式表与 JS，然后建立指定格式的 HTML 标签，并且添加一个有意义的 class 或者 id，方便获取。
<html>
<head>
<meta charset="utf-8">
<title>hhScroll demo</title>
<link rel="stylesheet" href="style/hhScroll-x.x.x.css">
<script src="script/jquery-1.11.1.min.js"></script>
<script src="script/hhScroll-x.x.x.js"></script>
</head>
<body>
<div class="gallery">
<div><a href="javascript:;"><img src="image/slide01.jpg" /></a></div>
<div><a href="javascript:;"><img src="image/slide02.jpg" /></a></div>
<div><a href="javascript:;"><img src="image/slide03.jpg" /></a></div>
<div><a href="javascript:;"><img src="image/slide04.jpg" /></a></div>
<div><a href="javascript:;"><img src="image/slide05.jpg" /></a></div>
</div>
</body>
</html>
javascript
最后一步，只需要一行 JS 代码，你会爱上这个插件（默认尺寸：900 x 400 像素）。
$(".gallery").hhscroll();// 一行代码
最终代码
<html>
<head>
<meta charset="utf-8">
<title>hhScroll demo</title>
<link rel="stylesheet" href="style/hhScroll-x.x.x.css">
<script src="script/jquery-1.11.1.min.js"></script>
<script src="script/hhScroll-x.x.x.js"></script>
<script>
$(document).ready(function(){
$(".gallery").hhscroll();// 一行代码
});
</script>
</head>
<body>
<div class="gallery">
<div><a href="javascript:;"><img src="image/slide01.jpg" /></a></div>
<div><a href="javascript:;"><img src="image/slide02.jpg" /></a></div>
<div><a href="javascript:;"><img src="image/slide03.jpg" /></a></div>
<div><a href="javascript:;"><img src="image/slide04.jpg" /></a></div>
<div><a href="javascript:;"><img src="image/slide05.jpg" /></a></div>
</div>
</body>
</html>
OK，现在你已经入门了，你可以继续学习