最近做影视的时候 遇到一个集数分集显示,类似下面的效果【用的jquery iscroll插件】
在手机端预览的时候可以左右拖动集数 效果如下
html:
<div class="le-tabs" id="wrapper3"><ul class="pagerlist clearfix"><li class="tab-item cur" page="1"><a>1-20</a></li><li class="tab-item" page="2"><a>21-40</a></li><li class="tab-item" page="3"><a>41-60</a></li><li class="tab-item" page="4"><a>61-80</a></li><li class="tab-item" page="5"><a>81-100</a></li><li class="tab-item" page="6"><a>101-120</a></li><li class="tab-item" page="7"><a>121-140</a></li><li class="tab-item" page="8"><a>141-160</a></li><li class="tab-item" page="9"><a>161-180</a></li><li class="tab-item" page="10"><a>181-200</a></li><li class="tab-item" page="11"><a>201-220</a></li><li class="tab-item" page="12"><a>221-240</a></li><li class="tab-item" page="13"><a>241-260</a></li><li class="tab-item" page="14"><a>261-280</a></li><li class="tab-item" page="15"><a>281-300</a></li><li class="tab-item" page="16"><a>301-320</a></li><li class="tab-item" page="17"><a>321-340</a></li><li class="tab-item" page="18"><a>341-360</a></li><li class="tab-item" page="19"><a>361-380</a></li></ul></div>
jquery:
<script src="iscroll-min.js"></script><script type="text/javascript">var myScroll3;function initscroll() { myScroll3 = new iScroll('wrapper3', {snap : true,momentum : false,hScrollbar : false,vScrollbar : false,hScroll:true,vScroll:false,checkDOMChanges : true });myScroll3.refresh();}document.addEventListener('DOMContentLoaded', initscroll, false);</script>