HTML 调用iscroll.js主要事项

iscroll是一款很不错的滚动控件(js),但是在调用的时候,需要注意一些事项:

1、iscroll支持水平和垂直滚动,那么在调用的时候,一定注意滚动div必须大于父div,也就是说,父div的宽度或者长度必须规定;

2、计算好子div和父div之间的宽度或者高度比值。比如,如果是水平滚动,父类width属性是100%,那么scroll中的宽度定义为300%,就表示,水平可滚动3个div节点

简单举例说明:

父div对应的css如下

.divscript{position:absolute; top:0em; bottom:3em; left:0; right:0; overflow-y:scroll; overflow-x:hidden;}

.top-img{position:absolute; z-index:2;}
时间: 2024-10-09 18:57:00

HTML 调用iscroll.js主要事项的相关文章

CocosCreator 中 JS 与 Java 互相调用方式和注意事项

JS 调用 Java 方法在 CocosCreator 下 JS 调用 Java/Objective-C 的格式都是: var o = jsb.reflection.callStaticMethod(className, methodName, methodSignature, parameters...)JS 只能调用 Java 中的静态方法,需要传入类名.方法名.方法签名.方法参数,并且可以获得返回值. 类名类名必须是包含 Java 包路径的完整类名,而且用斜线 / 代替点 . ,例如 co

iScroll.js的用法

一.iScroll.js的用法 概要 iScroll 4 这个版本完全重写了iScroll这个框架的原始代码.这个项目的产生完全是因为移动版webkit浏览器(诸如iPhone,iPad,Android 这些系统上广泛使用)提供了一种本地化的方式来对一个限定了高度和宽度的元素的内容进行滑动.很不幸的是,这种情况下所有的web应用的页面就不能够包含具有position:absolute的头.页尾或者是一个内容可滚动的中间区域. 然而,Android系统最新修订版已经可以支持这种功能了(尽管支持的力

jquery——移动端滚动条插件iScroll.js

官网:http://cubiq.org/iscroll-5 demo: 滚动刷新:http://cubiq.org/dropbox/iscroll4/examples/pull-to-refresh/ 'Carousel' demo iScroll功能很强大,目前我只用来 自定义滚动条 以下简单介绍一下iscrol在移动端自定义滚动条时的使用和注意事项. 一.用法 iScroll对要滚动的元素进行初始化,且不限制一个页面中使用iScroll的元素个数. 使用iScroll时,DOM树的结构要足够

移动端下拉刷新,iScroll.js用法(转载)

分享是传播.学习知识最好的方法 [作者]:挨踢前端 [出处]:http://www.cnblogs.com/duanhuajian/ [声明]:所有博文标题后加(share)的表示收集的他人优秀文章,其余的则为原创. 官网:http://cubiq.org/iscroll-4 概要 iScroll 4 这个版本完全重写了iScroll这个框架的原始代码.这个项目的产生完全是因为移动版webkit浏览器(诸如iPhone,iPad,Android 这些系统上广泛使用)提供了一种本地化的方式来对一个

iScroll.js插件使用方法

iScroll.js 用法参考 (share) 分享是传播.学习知识最好的方法 以下这篇文章是iScroll.js官网的中文翻译,尽管自己英文不好,但觉得原作者们翻译的这个资料还是可以的,基本用法介绍清楚了.如果你英文比较好的话,可以看看官网的资料. 参考:http://www.cnblogs.com/asqq/archive/2012/04/23/2466132.html  ,  http://www.nb88.net/Index/p/id/406 官网:http://cubiq.org/is

iScroll.js 用法参考 (share)

iScroll.js 用法参考 (share) 分享是传播.学习知识最好的方法 以下这篇文章是iScroll.js官网的中文翻译,尽管自己英文不好,但觉得原作者们翻译的这个资料还是可以的,基本用法介绍清楚了.如果你英文比较好的话,可以看看官网的资料. 参考:http://www.cnblogs.com/asqq/archive/2012/04/23/2466132.html  ,  http://www.nb88.net/Index/p/id/406 官网:http://cubiq.org/is

引用iScroll.js实现上拉和下拖刷新

使用技巧 1.引用iScroll.js, 在初始化时添加两个事件监听:touchMove.DOMContentLoaded. 2.实现iScroll插件的onScrollEnd事件, 也就是在这个事件里调用你自己的ajax方法实现数据的刷新和追加. 3.上拉加载更多请求后台时就相当于分页请求数据,这时候需要在ajax请求时发送pageIndex参数,而初始化加载时需要从后台返回一个pageCount以便前台判断. 4.最关键的就是实现下拉刷新方法(pullDownAction)和上拉加载更多(p

iscroll.js的简单使用方法

参考链接:https://www.cnblogs.com/Renyi-Fan/tag/js%E6%8F%92%E4%BB%B6/default.html?page=2 目录 一.总结 一句话总结:Scroll是一个类,每个需要使用滚动功能的区域均要进行初始化. 二.iscroll.js的简单使用方法(总结) 回到顶部 >  一.总结(点击显示或隐藏总结内容) 一句话总结:Scroll是一个类,每个需要使用滚动功能的区域均要进行初始化. 最佳的HTML结构如下: <div id="wr

运用iscroll.js遇到的问题

1.无法滑动的问题 需要检查iscroll.js文件加载上没有,如果加载上检查一下它和jquery文件加载的先后顺序.wrapper的position必须得写,bottom也必须得写. 2.滑不上去的问题 wrapper的height设置成了100%.所以出现这个问题,把这个属性去掉了好了 3.页面滑动不流畅(这样是暂时行可以,还没找到更好的解决办法)  #scroller {        transform: translate3d(0,0,0);        -webkit-transf