msclass 文字滚动_【JS特效】不间断滚动效果通用类
网上发现一个不错的js不间断滚动效果,今天来转载一下吧.这个js的作者应是崔永祥(因其博客已不存在,而无法确认),我这里只简单整理,只为笔记.
??? 需要通过样式,js来实现这个翻滚效果.
???
??? 1.在html里代码如下:
??? ??
?
?
???
?
?
???
?
//该函数使用说明,请看下面
new Marquee(”marqueediv1″,0,1,760,52,50,4000,500);??
??? 2.Marquee类说明
????? 创建实例:
//参数直接赋值法
new Marquee(”marquee”)
new Marquee(”marquee”,”top”)
……
new Marquee(”marquee”,0,1,760,52)
new Marquee(”marquee”,”top”,1,760,52,50,5000)
……
new Marquee(”marquee”,0,1,760,104,50,5000,3000,52)
new Marquee(”marquee”,null,null,760,104,null,5000,null,-1)
//参数动态赋值法
var marquee1 = new Marquee(”marquee”) *此参数必选
marquee1.Direction = “top”; 或者 marquee1.Direction = 0;
marquee1.Step = 1;
marquee1.Width = 760;
…
?
参数说明:
ID “marquee” 容器ID (必选)
Direction (0) 滚动方向 (可选,默认为0向上滚动) 可设置的值包括:0,1,2,3,”top”,”bottom”,”left”,”right” (0向上 1向下 2向左 3向右)
Step (1) 滚动的步长 (可选,默认值为2,数值越大,滚动越快)
Width (760) 容器可视宽度 (可选,默认值为容器初始设置的宽度)
Height (52) 容器可视高度 (可选,默认值为容器初始设置的高度)
Timer (50) 定时器 (可选,默认值为30,数值越小,滚动的速度越快,1000=1秒,建议不小于20)
DelayTime (5000) 间歇停顿延迟时间(可选,默认为0不停顿,1000=1秒)
WaitTime (3000) 开始时的等待时间(可选,默认或0为不等待,1000=1秒)
ScrollStep (52) 间歇滚动间距 (可选,默认为翻屏宽/高度,该数值与延迟均为0则为鼠标悬停控制,-1禁止鼠标控制)
1.65.071228
* 横向、纵向滚动格式调整 (解决横向滚动换行的问题,无需特殊设置)
* 彻底解决由于IE问题导致上下滚动页面留白的问题 (本次更新主要解决此问题,感谢天上的书生参与测试)
1.6.070131
+ 禁止鼠标控制暂停或继续 (将第9个参数设置为-1或者动态赋值将ScrollSetp设置为-1)
+ 判断是否可以滚动 (若内容区域小于显示区域,则自动取消滚动)
+ 跳过初始化错误 (避免引起其它滚动的停止)
+ 默认值 (除容器ID必选外,其他参数均可根据情况进行选择设置)
+ 参数动态赋值 (方向可用英文表示top|up|bottom|down|left|right,使其更直观、方便)
* 文字滚动不准确 (本次更新主要目的解决此Bug,感谢周珺参与测试)
1.4.061211
+ 鼠标悬停改变滚动方向 (鼠标悬停控制左右滚动)
* 由于文档下载过慢而导致获取的高度/宽度不准确
* 浏览器兼容问题 (IE、FF、Opera、NS、MYIE)
1.2.060922
+ 指定范围间歇滚动
* 程序调整
* 连续间歇滚动停止的错误
1.0.060901
+ 向下、向右滚动
+ 开始等待时间
+ 连续滚动
* 调整时间单位
* 滚动误差
* 随机死循环
* 加强性能
* 程序优化
0.8.060829
? 翻屏不间断向上、向左滚动
应用说明:页面包含
创建实例:
//参数直接赋值法
new Marquee(“marquee”)
new Marquee(“marquee”,”top”)
……
new Marquee(“marquee”,0,1,760,52)
new Marquee(“marquee”,”top”,1,760,52,50,5000)
……
new Marquee(“marquee”,0,1,760,104,50,5000,3000,52)
new Marquee(“marquee”,null,null,760,104,null,5000,null,-1)
//参数动态赋值法
var marquee1 = new Marquee(“marquee”) *此参数必选
marquee1.Direction = “top”; 或者 marquee1.Direction = 0;
marquee1.Step = 1;
marquee1.Width = 760;
marquee1.Height = 52;
marquee1.Timer = 50;
marquee1.DelayTime = 5000;
marquee1.WaitTime = 3000;
marquee1.ScrollStep = 52;
marquee1.Start();
参数说明:
ID “marquee” 容器ID (必选)
Direction (0) 滚动方向 (可选,默认为0向上滚动) 可设置的值包括:0,1,2,3,”top”,”bottom”,”left”,”right” (0向上 1向下 2向左 3向右)
Step (1) 滚动的步长 (可选,默认值为2,数值越大,滚动越快)
Width (760) 容器可视宽度 (可选,默认值为容器初始设置的宽度)
Height (52) 容器可视高度 (可选,默认值为容器初始设置的高度)
Timer (50) 定时器 (可选,默认值为30,数值越小,滚动的速度越快,1000=1秒,建议不小于20)
DelayTime (5000) 间歇停顿延迟时间(可选,默认为0不停顿,1000=1秒)
WaitTime (3000) 开始时的等待时间(可选,默认或0为不等待,1000=1秒)
ScrollStep (52) 间歇滚动间距 (可选,默认为翻屏宽/高度,该数值与延迟均为0则为鼠标悬停控制,-1禁止鼠标控制)
使用建议:
1、建议直接赋予容器的显示区域的宽度和高度,如(
)
2、建议为容器添加样式overflow = auto,如(
)
3、为了更准确的获取滚动区域的宽度和高度,请尽可能将各滚动单位直接赋予正确宽高度
4、对于TABLE标记的横向滚动,需要对TABLE添加样式display = inline,如(
)
5、对于翻屏滚动或间歇滚动,要注意各滚动单位间的间距,同时需要对容器的可视高度和可视宽度做好准确的设置,对于各滚动单位间的间距可以通过设置行间距或者单元格的高宽度来进行调整
6、对于LI自动换行的问题暂时没有更好的解决办法,建议将其转换成表格(TABLE)的形式来达到同等的效果
7、针对横向滚动的文字段落,如果最末端是以空格” “结束的,请将空格” “转换成”?”
8、鼠标悬停滚动思想源自Flash,所以有一定的局限性(容器内仅允许用图片或者带链接的图片的形式,并需要禁止其自动换行)
?
msclass 文字滚动_【JS特效】不间断滚动效果通用类相关推荐
- html js 链接滚动效果,【JS特效】不间断滚动效果通用类
网上发现一个不错的js不间断滚动效果,今天来转载一下吧.这个js的作者应是崔永祥(因其博客已不存在,而无法确认),我这里只简单整理,只为笔记. ??? 需要通过样式,js来实现这个翻滚效果. ??? ...
- jquery图片左右滚动切换js特效
下载地址 jquery图片左右滚动切换特效,左右箭头控制图片滚动的网页特效代码.$(".productshow").xslider({ //.productshow是要移动对象的外 ...
- 鼠标悬停文字断裂字体js特效
下载地址 一款鼠标悬停文字断裂字体特效,该特效实现了鼠标悬停文字断裂的动画特效,能够让您的网页生动起来. dd:
- html 图片自动滚动播放,JS实现图片自动滚动(图片横向滚动)
实带道术用量确示常构端析以要效开的用,近不现的效果就是 一排图片自动横向滚动,鼠标指向的时候,暂定滚动,鼠标离开,继续滚要圈器是天的年编功小还久概据含直这请框结业未商屏页屏随会维气大机域页效实一应控高 ...
- html加js实现滚动图片,js实现图片无缝滚动
js无缝滚动效果几乎在任何网页上都能看到它的身影,有的可能是使用插件,其实使用原始的javascript比较简单. 主要的是使用js位置知识. 1.innerHTML:设置或获取元素的html标签 2 ...
- 可爱生动的js文字弹幕动画js特效
下载地址 这是一款可爱生动的js文字弹幕动画特效,在文本框输入你想表达的文字,会显示在空中形成文字弹幕滚动效果. dd:
- css倾斜发光文字鼠标移动js特效
下载地址 一款粉色的css字体发光效果,倾斜发光文字素材分享给大家,只需鼠标悬停文字,即可产生倾斜发光和放大缩小的动画效果. dd:
- 页面无法滚动_【前端词典】滚动穿透问题的解决方案
点击上方"前端真好玩",喜欢他就关注他 听说,看恺哥的文章会上瘾 背景 产品有三宝,弹窗,浮层加引导: 设计有三宝,透明,阴影加圆角: 运营有三宝,短信,推送加红包: 程序员有一宝 ...
- html 向上滚动 不间断,向上不间断滚动div+css+js模板
div+css不间断向上滚动模板 上一次给大家介绍一种div css的不间断滚动代码JS特别多(不间断滚动css代码),这次给大家介绍的是比较实用比较简单的不间断css滚动代码 DIV+CSS不间断滚 ...
最新文章
- PHP_常用字符串处理函数
- webApp移动开发之REM
- 山东赛区国赛答辩成绩公示
- 设计一个成绩分类 输入成绩 输出优秀_BenQ 明基 PD2720U 27寸 Thunderbolt3.0 专业设计显示器开箱评测...
- ValueError: invalid \x escape
- Python 懂车帝全车系销量排行榜
- 大数据风控-反欺诈之黑卡与养卡
- shell脚本中的坑
- Auto Lisp 标注子样式_FAIR 开放大规模细粒度词汇级标记数据集 LVIS,连披萨里的菠萝粒都能完整标注...
- 运送超级计算机 蓝书368
- React的Transaction浅析
- Nginx 禁止访问某个目录或文件的设置方法
- linux每隔多久调度y,Linux 进程调度+Linux系统一般执行过程 笔记
- sequence——强行推式子+组合意义
- pcb板可挖孔吗_PCB板微孔加工方法之机械钻孔
- OAuth2.0_授权服务配置_资源服务测试_Spring Security OAuth2.0认证授权---springcloud工作笔记146
- html点击按钮动态添加input文本框
- Notepad++使用SQL格式化插件
- matlab 亚像素边缘检测,一种亚像素边缘检测方法与流程
- SQLServer 自定义函数 日期计算月初/月末/年初/年末/季初/季末
热门文章
- 统计分析基础-描述数据
- dotnet 读 WPF 源代码笔记 提升调试效率的 NamedObject 类型
- hpm1216nfh驱动程序_M1216nfh 驱动-HP 惠普 LaserJet Pro M1216nfh多功能一体机驱动下载4.0官方版-东坡下载...
- 华为ModelArts自定义镜像(PyTorch镜像)
- 磁盘分区方式——MBR与GPT之学习笔记
- eSIM终端的生产流程的思考
- 【第31篇】探索普通视觉Transformer Backbones用于物体检测
- 今年 NFT 爆火,如何快速入行?(艺术家完整指南)
- polkadot介绍
- Unity3D学习之第二个游戏制作日记