调用的方法:
首先你得把脚本链接到你的页面,或者直接调用下面这个链接也行。当然,最好还是下载到你自己的机器上。
复制代码 代码如下:<script type="text/javascript" src="/UploadFiles/2021-04-02/scrollingAD.js">复制代码 代码如下:var sampleDiv = new scrollingAD("divId", 200, 100, "yellow", "up", 10, 2000, 20, true);
sampleDiv.move();
这样将根据文档中 id="divId" 的某个 DIV 对象来创建一个不间断的循环滚动区域。该区域的宽度为 200px,高度为 100px, 背景颜色为黄色(不用担心你的英文不好,也可以用“#ff00ff”这样的格式),方向为向上滚动。其实你也可以选择向左滚动,只要把 "up" 改成 "left" 就行了。但是不支持向右和向下滚动,所以不用尝试 "right" 和 "down"——其实要实现这两个方向也很容易,不过个人觉得不太实用,所以就没做了——每滚动 1px 的延迟时间为 10ms,也就是理想状态下是每秒钟滚动 100px。每滚动 20px 暂停一次,每次暂停的时间是 2 秒。并且支持鼠标悬停。
上面提到的参数的排列顺序是必须严格遵守的,也就是说得按照下面的顺序来排列。如果你想偷懒,可以使用逗号略过:
复制代码 代码如下:1、图层的 ID,必须的参数,不填或者拼写错误将会报错;
2、滚动区域的宽度,默认值是 200px,所有的默认值都可以在 scrollingAD 里面修改;
3、滚动区域的高度,默认值是 50px;
4、背景颜色,默认值是 "transparent",也就是透明啦;
5、方向,可选值 "up/left";
6、每滚动 1px 的延迟时间,默认值 20,单位是 ms——这个值越大滚动越慢;
7、每滚动限定距离后停滞的时间,单位也是 ms,默认值 2000,也就是 2 秒啦——如果你不想停滞的话,把它设为 0 就行了;
8、每两次停滞之间滚动的距离,默认值是一屏。也就是说如果你设定的方向是 "up" 的话,默认值即等于滚动区域的高度,反之方向为 "left",则默认值为滚动区域的宽度;
9、是否悬停,默认是 true,这个你不填也没关系;
第二种方法是这样的:
复制代码 代码如下:var sampleDiv = new scrollingAD("divId");
sampleDiv.move();
这样使用的全部都是默认值,不过你应该会觉得必须改掉某个参数才行,那你可以这样:
var sampleDiv = new scrollingAD("divId");
sampleDiv.width = 500;
sampleDiv.height = 100;
sampleDiv.bgColor = "red";
sampleDiv.direction = "left";
sampleDiv.delay = 10;
sampleDiv.pauseTime = 1000;
sampleDiv.size = 50;
sampleDiv.isHover = false;
sampleDiv.move();
当然你不需要像上面这样全部写出来,你只要修改必要的参数就行了。如果你使用了第一种方法来创建滚动区域,但是又在后面用这种方式修改过了,则以后面的为准。
需要注意的是,你应该使用这样的顺序来建立这个滚动区域:
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行] 提示:您可以先修改部分代码再运行
更新:
现在可以使用百分比来定义 size 参数了,像这样:
var sampleDiv = new scrollingAD("sampleDiv");
sampleDiv.size = "50%";// 注意,一定要加引号,否则会出错。
sampleDiv.move();
得到的效果就是一个循环只滚动两次,同理一次滚完一个循环的话,将 size 设置为 "100%" 就行了。不过不建议随意设置百分比,请尽量设置成与行数相符的数值,否则可能出现意外的空白。
当然,仍然支持数字:)
首先你得把脚本链接到你的页面,或者直接调用下面这个链接也行。当然,最好还是下载到你自己的机器上。
复制代码 代码如下:<script type="text/javascript" src="/UploadFiles/2021-04-02/scrollingAD.js">复制代码 代码如下:var sampleDiv = new scrollingAD("divId", 200, 100, "yellow", "up", 10, 2000, 20, true);
sampleDiv.move();
这样将根据文档中 id="divId" 的某个 DIV 对象来创建一个不间断的循环滚动区域。该区域的宽度为 200px,高度为 100px, 背景颜色为黄色(不用担心你的英文不好,也可以用“#ff00ff”这样的格式),方向为向上滚动。其实你也可以选择向左滚动,只要把 "up" 改成 "left" 就行了。但是不支持向右和向下滚动,所以不用尝试 "right" 和 "down"——其实要实现这两个方向也很容易,不过个人觉得不太实用,所以就没做了——每滚动 1px 的延迟时间为 10ms,也就是理想状态下是每秒钟滚动 100px。每滚动 20px 暂停一次,每次暂停的时间是 2 秒。并且支持鼠标悬停。
上面提到的参数的排列顺序是必须严格遵守的,也就是说得按照下面的顺序来排列。如果你想偷懒,可以使用逗号略过:
复制代码 代码如下:1、图层的 ID,必须的参数,不填或者拼写错误将会报错;
2、滚动区域的宽度,默认值是 200px,所有的默认值都可以在 scrollingAD 里面修改;
3、滚动区域的高度,默认值是 50px;
4、背景颜色,默认值是 "transparent",也就是透明啦;
5、方向,可选值 "up/left";
6、每滚动 1px 的延迟时间,默认值 20,单位是 ms——这个值越大滚动越慢;
7、每滚动限定距离后停滞的时间,单位也是 ms,默认值 2000,也就是 2 秒啦——如果你不想停滞的话,把它设为 0 就行了;
8、每两次停滞之间滚动的距离,默认值是一屏。也就是说如果你设定的方向是 "up" 的话,默认值即等于滚动区域的高度,反之方向为 "left",则默认值为滚动区域的宽度;
9、是否悬停,默认是 true,这个你不填也没关系;
第二种方法是这样的:
复制代码 代码如下:var sampleDiv = new scrollingAD("divId");
sampleDiv.move();
这样使用的全部都是默认值,不过你应该会觉得必须改掉某个参数才行,那你可以这样:
var sampleDiv = new scrollingAD("divId");
sampleDiv.width = 500;
sampleDiv.height = 100;
sampleDiv.bgColor = "red";
sampleDiv.direction = "left";
sampleDiv.delay = 10;
sampleDiv.pauseTime = 1000;
sampleDiv.size = 50;
sampleDiv.isHover = false;
sampleDiv.move();
当然你不需要像上面这样全部写出来,你只要修改必要的参数就行了。如果你使用了第一种方法来创建滚动区域,但是又在后面用这种方式修改过了,则以后面的为准。
需要注意的是,你应该使用这样的顺序来建立这个滚动区域:
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行] 提示:您可以先修改部分代码再运行
更新:
现在可以使用百分比来定义 size 参数了,像这样:
var sampleDiv = new scrollingAD("sampleDiv");
sampleDiv.size = "50%";// 注意,一定要加引号,否则会出错。
sampleDiv.move();
得到的效果就是一个循环只滚动两次,同理一次滚完一个循环的话,将 size 设置为 "100%" 就行了。不过不建议随意设置百分比,请尽量设置成与行数相符的数值,否则可能出现意外的空白。
当然,仍然支持数字:)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件!
如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
桃源资源网 Design By www.nqtax.com
暂无“非常不错的不间断循环滚动类 兼容多浏览器”评论...
RTX 5090要首发 性能要翻倍!三星展示GDDR7显存
三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。
首次推出的GDDR7内存模块密度为16GB,每个模块容量为2GB。其速度预设为32 Gbps(PAM3),但也可以降至28 Gbps,以提高产量和初始阶段的整体性能和成本效益。
据三星表示,GDDR7内存的能效将提高20%,同时工作电压仅为1.1V,低于标准的1.2V。通过采用更新的封装材料和优化的电路设计,使得在高速运行时的发热量降低,GDDR7的热阻比GDDR6降低了70%。