js连续滚动(上下左右)

 

这种滚动代码简单，效果也不错，但唯一的缺点就是滚动对象的长或宽不够时，它就停止运行“罢工”了

上
< base href = " http://www.lami.cn " >
< div id = demo style = overflow:hidden;height: 150 ;width: 90 ;background:# 214984 ;color:#ffffff >
< div id = demo1 >
<!--  定义图片  -->
< img src = " /img/link.gif " >
< img src = " /img/link1.gif " >
< img src = " /img/link2.gif " >
< img src = " /img/link3.gif " >
< img src = " /img/link4.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 >

 

下

< base href = " http://www.lami.cn " >
< div id = demo style = overflow:hidden;height: 150 ;width: 90 ;background:# 214984 ;color:#ffffff >
< div id = demo1 >
<!--  定义图片  -->
< img src = " /img/link.gif " >
< img src = " /img/link1.gif " >
< img src = " /img/link2.gif " >
< img src = " /img/link3.gif " >
< img src = " /img/link4.gif " >
</ div >
< div id = demo2 ></ div >
</ div >< script >
var  speed = 30
demo2.innerHTML = demo1.innerHTML
demo.scrollTop = demo.scrollHeight
function  Marquee(){
if (demo1.offsetTop - demo.scrollTop >= 0 )
demo.scrollTop += demo2.offsetHeight
else {
demo.scrollTop --
}
}
var  MyMar = setInterval(Marquee,speed)
demo.onmouseover = function () {clearInterval(MyMar)}
demo.onmouseout = function () {MyMar = setInterval(Marquee,speed)}
</ script >

 

左

< base href = " http://www.lami.cn " >
< div id = demo style = overflow:hidden;height: 33 ;width: 200 ;background:# 214984 ;color:#ffffff >
< table align = left cellpadding = 0  cellspace = 0  border = 0 >
< tr >
< td id = demo1 valign = top >< img src = " /img/link.gif " >< img src = " /img/link1.gif " >< img src = " /img/link2.gif " >< img src = " /img/link3.gif " >
</ td >
< td id = demo2 valign = top ></ td >
</ tr >
</ table >
</ div >

< script >
var  speed = 30
demo2.innerHTML = demo1.innerHTML
function  Marquee(){
if (demo2.offsetWidth - demo.scrollLeft <= 0 )
demo.scrollLeft -= demo1.offsetWidth
else {
demo.scrollLeft ++
}
}
var  MyMar = setInterval(Marquee,speed)
demo.onmouseover = function () {clearInterval(MyMar)}
demo.onmouseout = function () {MyMar = setInterval(Marquee,speed)}
</ script >

 

右

< base href = " http://www.lami.cn " >
< div id = demo style = overflow:hidden;height: 33 ;width: 200 ;background:# 214984 ;color:#ffffff >
< table align = left cellpadding = 0  cellspace = 0  border = 0 >
< tr >
< td id = demo1 valign = top >< img src = " /img/link.gif " >< img src = " /img/link1.gif " >< img src = " /img/link2.gif " >< img src = " /img/link3.gif " >
</ td >
< td id = demo2 valign = top ></ td >
</ tr >
</ table >
</ div >< script >
var  speed = 30
demo2.innerHTML = demo1.innerHTML
demo.scrollLeft = demo.scrollWidth
function  Marquee(){
if (demo.scrollLeft <= 0 )
demo.scrollLeft += demo2.offsetWidth
else {
demo.scrollLeft --
}
}
var  MyMar = setInterval(Marquee,speed)
demo.onmouseover = function () {clearInterval(MyMar)}
demo.onmouseout = function () {MyMar = setInterval(Marquee,speed)}
</ script >

 
<script type="text/javascript"> </script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>