js文字滚动效果,html实现文字滚动
向上滚动
超文本标记语言
头
META http-equiv= Content-Type Content= text/html； charset=gb2312
标题教你用爪哇岛描述语言制作连续滚动的字幕/标题
/头
身体
div id=marquees ！-这些是字幕的内容，你可以任意定义- a href=# 链接1 /a
br a href=# 链接2 /a
br a href=# 链接3 /a
br a href=# 链接4 /a
br！-字幕内容结束-
/div
！-以下是爪哇岛描述语言代码-
脚本语言=javascript
！-
marquee height=200//内容区高度
stopscroll=false//这个变量控制是否停止滚动
带有（侯爵){
noWrap=true//这句表内容区不自动换行
风格。宽度=0；//于是我们可以将它的宽度设为0,因为它会被撑大
style.height=marqueesHeight
style.overflowY= hidden//滚动条不可见
电子战函数(停止滚动=真)；//鼠标经过，停止滚动
onmouseout=new函数(停止滚动=false )；//鼠标离开，开始滚动
}
//这时候，内容区的高度是无法读取了。下面输出一个不可见的层模板播放者，稍后将内容复制到里面：
文档。write( div id= templayer /div
函数init(){ //初始化滚动内容
//多次复制原内容到模板播放者，直到 templayer 的高度大于内容区高度：
while(templayer。偏移高度字幕高度){
临时工。innerhtml=marquees。innerhtml
} //把 templayer 的内容的"两倍"复制回原内容区：
马奎斯。innerhtml=templayer。innerhtml模板。innerhtml
//设置连续超时，调用scrollUp()函数驱动滚动条：
setInterval(scrollUp()，20)；
}
文档。身体。onload=init
preTop=0；//这个变量用于判断滚动条是否已经到了尽头
函数scrollUp(){ //滚动条的驱动函数
if(stopscroll==true)返回；//如果变量停止滚动为真，则停止滚动
preTop=marquees.scrollTop//记录滚动前的滚动条位置
马奎斯。scroll top=1；//滚动条向下移动一个像素
//如果滚动条不动了，则向上滚动到和当前画面一样的位置
//当然不仅如此，同样还要向下滚动一个像素( 1):
if(preTop==marquees。向上滚动){
马奎斯。scroll top=templayer。offset height-marquee height 1；
}
}
-
/脚本
/BODY /HTML
向下滚动
div id=marquees a href=# 链接一/a br
英国铁路公司
a href=# 链接二/a br
英国铁路公司
a href=# 链接三/a br
英国铁路公司
a href=# 链接四/a br
英国铁路公司
/div
脚本语言=JavaScript
镶嵌高度=200
带有（侯爵){
风格。宽度=0；
style.height=marqueesHeight
“可见”
style.overflowY= hidden
noWrap=true
电子战函数(停止滚动=真)；
onmouseout=new函数(停止滚动=false )；
}
文档。write( div id= templayer /div
preTop=0；currentTop=0；get limit=0；stopscroll=false
函数init(){
临时工。innerhtml=
while(templayer。偏移高度字幕高度){
临时工。innerhtml=marquees。innerhtml
}
马奎斯。innerhtml=templayer。innerhtml
setInterval(scrollDown()，10)；
} init()；
函数scrollDown(){
if(stopscroll==true)返回；
preTop=marquees.scrollTop
马奎斯。scroll top-=1；
if(preTop==marquees。向上滚动){
如果(!getlimit){
马奎斯。scroll top=templayer。偏移高度* 2；
获取限制=marquees。滚动顶部；
}
马奎斯。scroll top=get limit-templayer。偏移高度字幕高度；
马奎斯。scroll top-=1；
}
}
/脚本
向左滚动
div id=marquees
a href=# 链接一/a
a href=# 链接二/a
a href=# 链接三/a
a href=# 链接四/a
/div
div id=templayer /div
脚本语言=JavaScript
marqueesWidth=200
带有（侯爵){
风格。高度=0；
style.width=marqueesWidth
style.overflowX= hidden
可见
noWrap=true
电子战函数(停止滚动=真)；
onmouseout=new函数(停止滚动=false )；
}
pre left=0；当前左侧=0；stopscroll=false
函数init(){
临时工。innerhtml=
while(templayer。offsetwidth marqueesWidth){
临时工。innerhtml=marquees。innerhtml
}
马奎斯。innerhtml=templayer。innerhtml
setInterval(scrollLeft()，10)；
} init()；
函数scrollLeft(){
if(stopscroll==true)返回；
左前=字幕。向左滚动；
马奎斯。向左滚动=1；
if(pre left==marquees。向左滚动){
马奎斯。向左滚动=templayer。offsetwidth-marquees宽度1；
}
}
/脚本
向右滚动
div id=marquees
a href=# 链接一/a
a href=# 链接二/a
a href=# 链接三/a
a href=# 链接四/a
/div
div id=templayer /div
脚本语言=JavaScript
marqueesWidth=200
带有（侯爵){
风格。高度=0；
style.width=marqueesWidth
style.overflowX= hidden
可见
noWrap=true
电子战函数(停止滚动=真)；
onmouseout=new函数(停止滚动=false )；
}
preTop=0；currentTop=0；get limit=0；stopscroll=false
函数init(){
临时工。innerhtml=
while(templayer。offsetwidth marqueesWidth){
临时工。innerhtml=marquees。innerhtml
}
马奎斯。innerhtml=templayer。innerhtml
setInterval(scrollRight()，10)；
} init()；
函数scrollRight(){
if(stopscroll==true)返回；
左前=字幕。向左滚动；
马奎斯。向左滚动-=1；
if(pre left==marquees。向左滚动){
如果(!getlimit){
马奎斯。向左滚动=临时层。offsetwidth * 2；
获取限制=marquees。向左滚动；
}
马奎斯。向左滚动=获取限制-templayer。偏移宽度字幕宽度；
马奎斯。向左滚动-=1；
}
}
/脚本
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。