参考:
http://www.areaaperta.com/nicescroll/
该插件支持移动设备;
可上下、左右拖拉滚动;
看图,上面的分类菜单就是。
导入:
<script type="text/javascript" src="js/jquery.nicescroll.min.js"></script>
定义需要滚动的区域,#boxscroll是vieport, #categorys是content:。这里#categorys里的内容是动态生成的。
<div id="boxscroll">
<div id="categorys">
</div>
</div>
我这里#categorys里面动态添加的是一个一个的span
计算每一个span的长度,叠加起来就是#categorys的长度
实际上告诉niceScroll需要滚动的距离。
我也不知道为什么要计算这个,反正动态添加的元素需要这样做。
或者调用$("#mydiv").getNiceScroll().resize();试一下,反正我没试!
var w=0;
$("#categorys").children().each(function(){
w+=$(this).outerWidth();
});
$("#categorys").width(w);
//横向滚动
$("#boxscroll").niceScroll("#categorys",{touchbehavior:true,cursorcolor:"#FF00FF",cursoropacitymax:0.6,cursorwidth:24,usetransition:true,hwacceleration:true,autohidemode:"hidden",horizrailenabled:true});
- 大小: 119.7 KB
分享到:
相关推荐
jquery自定义滚动条插件 1.兼容ie8+ 的自定义滚动条 2.滚动条样式完全自定义 3.单页面多次调用
插件描述:自定义滚动条,实现滚轮滚动内容. 参考示例:http://www.jq22.com/jquery-info4572
NULL 博文链接:https://justcoding.iteye.com/blog/2110616
malihu是一款高性能的滚动条美化jQuery插件。该滚动条美化插件支持水平和垂直滚动条,支持鼠标滚动,支持键盘滚动和支持移动触摸屏。并且它可以和jQuery UI和Bootatrap完美的结合,相当的强大。
JQ浏览器滚动条插件 浏览器滚动条美化JQ浏览器滚动条插件 浏览器滚动条美化
各种jquery自定义滚动条,可以很容易的自己修改样式
NULL 博文链接:https://gundumw100.iteye.com/blog/2115403
使用jquery.layout.js布局,并且使用自定义滚动条
自定义文件上传框上传成功后显示图片的函数是callback ,调用正式操作之前的函数是callhook。前者是反馈图片在服务端路径,后者是添加使用插件之外需要布置的其他辅助代码。
jQuery table scroll表格插件内容部分加滚动条
Nicescroll 是制作自定义滚动条的jq插件。支持div,iframe,html等
实现了自定义美化滚动条jquery插件,主要用了jquery滚动条插件jquery.mCustomScrollbar.js,原下载地址:http://www.jq-school.com/Detail.aspx?id=348
这次我们要来分享一些关于网页表格数据展示优化的jQuery插件,首先表格的表头是固定的,当数据行比较多时,向下...其次表格的滚动条时经过美化过的,重写了浏览器自带的滚动条样式,这样让整个数据表格显得更加美观。
jQuery全屏页面滚动效果页面上下滚动效果代码jq插件
DIV+css+js打造的滚动条,特别个性。
单图。多图查看,旋转,放大缩小 jq插件
最优秀的50个JQ插件最优秀的50个JQ插件最优秀的50个JQ插件最优秀的50个JQ插件最优秀的50个JQ插件最优秀的50个JQ插件
share分享,JQ第三方分享插件,可自定义链接、标题,移动端H5
通过五个jquery插件联合调用的方式,来形成可以批量上传图片。没有用ajax,而是采取iframe来做图片无刷新上传。
JQ 插件简单实用步骤条