js实现图片无缝滚动的完美解决_无间隙滚动

js实现图片无缝滚动的完美解决_无间隙滚动

ID:14764439

大小:36.00 KB

页数:3页

时间:2018-07-30

js实现图片无缝滚动的完美解决_无间隙滚动_第1页
js实现图片无缝滚动的完美解决_无间隙滚动_第2页
js实现图片无缝滚动的完美解决_无间隙滚动_第3页
资源描述:

《js实现图片无缝滚动的完美解决_无间隙滚动》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库

1、想必大家都注意到的不循环滚动,所以出现了很多替代脚本,或iframe或JS输出,不管怎么做,都略显麻烦。下面说一下这个相对简单的实现思路:一个设定宽度并且隐藏超出它宽度的内容的容器demo,里面放demo1和demo2,demo1是滚动内容,demo2为demo1的直接克隆,通过不断改变demo1的scrollTop或者scrollLeft达到滚动的目的,当滚动至demo1与demo2的交界处时直接跳回初始位置,因为demo1与demo2一样,所以分不出跳动的瞬间,从而达到“无缝”滚动的目的。先了解

2、一下对象的几个的属性:innerHTML:设置或获取位于对象起始和结束标签内的HTMLscrollHeight:获取对象的滚动高度。scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离scrollWidth:获取对象的滚动宽度offsetHeight:获取对象相对于版面或由父坐标offsetParent属性指定的父坐标的高度offsetLeft:获取对象相对于版面或由offsetParent属性指定的父坐标的计算左侧位置off

3、setTop:获取对象相对于版面或由offsetTop属性指定的父坐标的计算顶端位置offsetWidth:获取对象相对于版面或由父坐标offsetParent属性指定的父坐标的宽度好,先看这个向上滚动的代码:    <

4、imgsrc="images/link/flashempire.gif">       

5、c="/Upload/2004_Pack/link.gif">      向下滚动: <

7、divid=demostyle=overflow:hidden;height:100;width:90;background:#214984;color:#ffffff>      

8、eng.gif">   

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。