代码
<
div
id
=demo
style
=overflow:hidden;height:200;width:150
>
<
div
id
=demo1
>
<
img
onclick
="get_larger(this)"
src
='http://www.fengfly.com/images/face/image21.gif'
style
="CURSOR: pointer"
>
<
img
onclick
="get_larger(this)"
src
='http://www.fengfly.com/images/face/image21.gif'
style
="CURSOR: pointer"
>
<
img
onclick
="get_larger(this)"
src
='http://www.fengfly.com/images/face/image21.gif'
style
="CURSOR: pointer"
>
<
img
onclick
="get_larger(this)"
src
='http://www.fengfly.com/images/face/image21.gif'
style
="CURSOR: pointer"
>
<
img
onclick
="get_larger(this)"
src
='http://www.fengfly.com/images/face/image21.gif'
style
="CURSOR: pointer"
>
</
div
>
<
div
id
=demo2
></
div
>
</
div
>
<
script
>
var
speed
=
30
;
demo2.innerHTML
=
demo1.innerHTML
function
Marquee()
{
if
(demo2.offsetTop
-
demo.scrollTop
<=
0
)
demo.scrollTop
-=
demo1.offsetHeight;
else
demo.scrollTop
++
;
}
var
MyMar
=
setInterval(Marquee,speed)
demo.onmouseover
=
function
() {clearInterval(MyMar)}
demo.onmouseout
=
function
() {MyMar
=
setInterval(Marquee,speed)}
</
script
>
<div id=demo style=overflow:hidden;height:200;width:150>
<div id=demo1>
<img οnclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
<img οnclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
<img οnclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
<img οnclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
<img οnclick="get_larger(this)" src='http://www.fengfly.com/images/face/image21.gif' style="CURSOR: pointer" >
</div>
<div id=demo2></div>
</div>
<script>
var speed=30;
demo2.innerHTML=demo1.innerHTML
function Marquee()
{
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight;
else
demo.scrollTop++;
}
var MyMar=setInterval(Marquee,speed)
demo.οnmοuseοver=function() {clearInterval(MyMar)}
demo.οnmοuseοut=function() {MyMar=setInterval(Marquee,speed)}
</script>
方法二:
方法二代码
<
div
style
="width:200px;overflow:hidden"
>
< div style ="position:relative;top:0px;left:0px;white-space:nowrap" id =news >
< span id =nbo > 新闻内容1 新闻内容2 新闻内容3 新闻内容4 新闻内容5 新闻内容6 </ span >
< script language =javascript >
// 重复一次新闻内容
document.write(nbo.innerHTML);
</ script >
</ div >
</ div >
< script language =javascript >
// 实现不间断滚动
function newsScroll()
{
news.style.pixelLeft = (news.style.pixelLeft - 1 ) % nbo.offsetWidth;
}
timer1 = setInterval( ' newsScroll() ' , 10 ) // 更改第二个参数可以改变速度,值越小,速度越快。
</ script >
< div style ="position:relative;top:0px;left:0px;white-space:nowrap" id =news >
< span id =nbo > 新闻内容1 新闻内容2 新闻内容3 新闻内容4 新闻内容5 新闻内容6 </ span >
< script language =javascript >
// 重复一次新闻内容
document.write(nbo.innerHTML);
</ script >
</ div >
</ div >
< script language =javascript >
// 实现不间断滚动
function newsScroll()
{
news.style.pixelLeft = (news.style.pixelLeft - 1 ) % nbo.offsetWidth;
}
timer1 = setInterval( ' newsScroll() ' , 10 ) // 更改第二个参数可以改变速度,值越小,速度越快。
</ script >