软件下载 | 资讯教程 | 最近更新 | 下载排行 | 一键转帖 | 发布投稿
您的位置:最火下载站 > Web前端 > 网页特效 > 页面综合 > 无缝滚动代码,JavaScript实现多形式的滚动效果

无缝滚动代码,JavaScript实现多形式的滚动效果

  一个中级的上、下、左、右滚动代码,Js无缝滚动代码,可以控制滚动速度、滚动方向,而且考虑到了obj.style.attr只能获取到行内样式,因而还增加了JS判断获取确切的外补丁,以消除非行内样式的外补丁对无缝衔接的影响。JS通过四次循环内部元素的方式来保持滚动,所以只要原始内容尺寸超过容器对应尺寸的1/4就能滚动,降低了之前两次循环元素时的滚动门槛。

  第一个参数 con_id 是用于JS找到元素的,是滚动元素的id。

  第二个参数 speed_num 是用来设置滚动速度的,数值越大,滚动速度越慢;单位默认是毫秒,不用写,只要写个正整数即可。

  第三个参数 direct 是用来控制滚动方向的,top/bottom/left/right,如果不是这四个值,则水平滚动默认向左,竖直滚动默认向上。注意几点:

  1、水平滚动的容器id给出的容器能且仅能有一个直接子节点!

  2、使用方式是在页面头部引入此文件,在需要滚动的容器的闭合标签后调用对应的滚动方法scrollSP(con_id,speed,direct)、scrollSZ(con_id,speed,direct)。

  示例代码(烈火网友情提示:为了方便演示,这里使用了数字代替文字和图片,如有需要请自行替换):


提示:可修改后代码再运行!

    相关阅读
    栏目导航
    推荐软件