本篇文章给大家分享的内容是浅析手机滑动插件--iscroll.js，有着一定的参考价值，有需要的朋友可以参考一下
话不多说，直接上代码：
//实例化滚动插件
var myscroll = new iscroll('#wrapper', {scrollx: true, freescroll: true});//实例化
myscroll.scrolltoelement('.active',true,true);//特定元素居中
不知道大神是怎么做的 ，我是这样计算宽度的–
//计算需要滚动盒子的宽度
var wrapper = $("#wrapper");
wrapper.find("ul").width((wrapper.find("li").length + 1) * wrapper.find("li").width());
完整实例
<!doctype html><html><head>
<meta charset="utf-8">
<title>html5 横向滚动</title>
<script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
<script src="http://cdn.bootcss.com/iscroll/5.2.0/iscroll.js"></script>
<style>
p{
width:80%; margin: 50px auto; border: 1px solid seagreen; overflow: hidden; }
ul{
margin: 0; padding: 0; list-style: none; overflow: hidden; }
li{
padding: 15px 0; float: left; list-style: none;
width: 100px;margin: 10px; text-align: center; background: rosybrown
}
li.active{ background: red;
}
</style></head><body><p class="wrapper"><ul>
<li>第1个</li>
<li>第2个</li>
<li>第3个</li>
<li>第4个</li>
<li>第5个</li>
<li class="active">第6个</li>
<li>第7个</li></ul></p><script>
var ele = $("ul");
ele.width((ele.find("li").length + 1) * (ele.find("li").width()+20));
var myscroll = new iscroll('p', {scrollx: true, scrolly: false});
myscroll.scrolltoelement('.active',true,true);</script></body></html>
相关推荐：
gethub官网地址
比较全的中文api
一目了然的用法
以上就是浅析手机滑动插件—iscroll.js的详细内容。