iScrol l是一个高性能，资源占用少，无依赖，多平台的javascript滚动插件(4kb)。
-
官方：
-
iScroll 访问不了 (iscrolljs.com)
-
iScroll github (https://github.com/cubiq/iscroll) ->
build 文件夹包含各个版本
-
iScroll
-
使用方法：
- 必须使用 三层结构 （滚动列表容器 -> 数据容器 -> 数据项 ），比如：
- div -> ul -> li
- div -> div ->div
- 至少设置 滚动列表容器 样式表 两个样式
- overflow:hidden; – 隐藏默认滚动条
- position:relative; – 必须为 滚动条 父容器设置定位
- 导入
iscroll.js文件 - 初始化 IScroll对象
- 传入 滚动列表容器 的 选择器名称
- 传入 参数对象
- mouseWheel: true – 鼠标滚轮控制
- scrollbars: true – 滚动条的显示
- 必须使用 三层结构 （滚动列表容器 -> 数据容器 -> 数据项 ），比如：
<style>
* {
margin: 0;
}
.wrapper {
width: 300px;
height: 200px;
overflow: hidden; /* 隐藏默认滚动条 */
border: 1px solid #0094ff;
margin: 0 auto;
position: relative; /* 必须为 滚动条 父容器设置定位 */
}
</style>
<!--1.三层结构-->
<div id="wrapper">
<ul>
<li>...</li>
<li>...</li>
...
</ul>
</div>
<!--2.初始化-->
<script type="text/javascript" src="iscroll.js"></script>
<script type="text/javascript">
new IScroll('#wrapper', {
mouseWheel: true, // 鼠标滚轮控制
scrollbars: true //滚动条的显示
})
</script>特点：
- 可以在PC，移动设备和智能电视平台上工作
- iScroll 可以处理任何需要与用户进行移动交互的元素：滚动，缩放，平移，无限滚动，视差滚动，旋转功能
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/71194.html
