1、图片向左无限滚动====================================================
<div id=demod style=overflow:hidden;height:157;width:714>
<table align=left cellpadding=0 cellspace=0 border=0>
<tr>
<td id=demo7 valign=top>
<table width='100%' cellpadding='0' cellspacing='5' border='0' align='center'>
<tr valign='top'>
<td align='left'><img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif"></td>
<td align='left'><img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif"></td>
<td align='left'><img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif"></td>
<td align='left'><img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif"></td>
</tr>
</table></td>
<td id=demo8 valign=top></td>
</tr>
</table>
</div>
<script>
var speed=30
demo8.innerHTML=demo7.innerHTML
function Marquee(){
if(demo8.offsetWidth-demod.scrollLeft<=0)
demod.scrollLeft-=demo7.offsetWidth
else{
demod.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demod.onmouseover=function() {clearInterval(MyMar)}
demod.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
2、图片向右无限滚动====================================================
<div id=demod style=overflow:hidden;height:70;width:400>
<table align=left cellpadding=0 cellspace=0 border=0>
<tr>
<td id=demo7 valign=top> <table width='100%' cellpadding='0' cellspacing='5' border='0' align='center'>
<tr valign='top'>
<td align='left'><img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif"></td>
<td align='left'><img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif"></td>
<td align='left'><img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif"></td>
</tr>
</table></td>
<td id=demo8 valign=top></td>
</tr>
</table>
</div>
<script>
var speed=30
demo8.innerHTML=demo7.innerHTML
demod.scrollLeft=demod.scrollWidth
function Marquee(){
if(demod.scrollLeft<=0)
demod.scrollLeft+=demo8.offsetWidth
else{
demod.scrollLeft--
}
}
var MyMar=setInterval(Marquee,speed)
demod.onmouseover=function() {clearInterval(MyMar)}
demod.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
3、图片向上无限滚动
====================================================
<div id=demo style=overflow:hidden;height:160;width:230>
<div id=demo1>
<img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif">
<img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif">
<img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif">
</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>
4、图片向下无限滚动====================================================
<div id=demob style=overflow:hidden;height:140;width:230>
<div id=demo3> <img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif">
<img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif">
<img src="http://www.sh7135.net/2006demo/images/default_r1_c4.gif">
</div>
<div id=demo4></div>
</div>
<script>
var speed=30;
demo4.innerHTML=demo3.innerHTML;
demob.scrollTop=demob.scrollHeight;
function Marquee(){
if(demo3.offsetTop-demob.scrollTop>=0)
demob.scrollTop+=demo4.offsetHeight;
else{
demob.scrollTop--;
}
}
var MyMar=setInterval(Marquee,speed)
demob.onmouseover=function() {clearInterval(MyMar)}
demob.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
评论