<!--适合左右滚动-->
<div id="demo" style="overflow:hidden;width:670px;color:#ffffff;">
<table cellpadding="0" cellspacing="0" border="0">
<tr><td id="demo1" valign="top" align="center">
<table cellpadding="2" cellspacing="0" border="0">
<tr align="center">
<td><img src="http://www.haao.cn/logo.gif" width="88" /></td>
<td><img src="http://www.haao.cn/logo.gif" width="88" /></td>
<td><img src="http://www.haao.cn/logo.gif" width="88" /></td>
<td><img src="http://www.haao.cn/logo.gif" width="88" /></td>
<td><img src="http://www.haao.cn/logo.gif" width="88" /></td>
</tr>
</table>
</td>
<td id="demo2" valign="top"></td>
</tr>
</table>
</div>
<!--//适合上下滚动
<div id=demo style=overflow:hidden;height:100;width:90; background:#214984;color:#ffffff>
<div id=demo1>
<img src="http://www.haao.cn/logo.gif">
<img src="http://www.haao.cn/logo.gif">
<img src="http://www.haao.cn/logo.gif">
<img src="http://www.haao.cn/logo.gif">
<img src="http://www.haao.cn/logo.gif">
<img src="http://www.haao.cn/logo.gif">
<img src="http://www.haao.cn/logo.gif">
<img src="http://www.haao.cn/logo.gif">
<img src="http://www.haao.cn/logo.gif">
</div>
<div id=demo2></div>
</div>
-->
<script type="text/javascript">
var speed=1//速度数值越大速度越慢
var rollmain=document.getElementById("demo")
var rollbegin=document.getElementById("demo1")
var rollfollow=document.getElementById("demo2")
rollfollow.innerHTML=rollbegin.innerHTML
//无间断向左滚动
function MarqueeLeft(){
if(rollfollow.offsetWidth-rollmain.scrollLeft<=0)
rollmain.scrollLeft-=rollbegin.offsetWidth
else{
rollmain.scrollLeft++
}
}
//无间断向右滚动
function MarqueeRight(){
if(rollmain.scrollLeft<=0)
rollmain.scrollLeft+=rollfollow.offsetWidth
else{
rollmain.scrollLeft--
}
}
//无间断向下滚动
function MarqueeDown(){
if(rollbegin.offsetTop-rollmain.scrollTop>=0)
rollmain.scrollTop+=rollfollow.offsetHeight
else{
demo.scrollTop--
}
}
//无间断向上滚动
function MarqueeUp(){
if(rollfollow.offsetTop-rollmain.scrollTop<=0)
rollmain.scrollTop-=rollbegin.offsetHeight
else{
rollmain.scrollTop++
}
}
//向左
var MyMar=setInterval(MarqueeLeft,speed)
rollmain.οnmοuseοver=function() {clearInterval(MyMar)}
rollmain.οnmοuseοut=function() {MyMar=setInterval(MarqueeLeft,speed)}
/*//向右
var MyMar=setInterval(MarqueeRight,speed)
rollmain.οnmοuseοver=function() {clearInterval(MyMar)}
rollmain.οnmοuseοut=function() {MyMar=setInterval(MarqueeRight,speed)}
*/
/*//向上
var MyMar=setInterval(MarqueeUp,speed)
rollmain.οnmοuseοver=function() {clearInterval(MyMar)}
rollmain.οnmοuseοut=function() {MyMar=setInterval(MarqueeUp,speed)}
*/
/*//向下
var MyMar=setInterval(MarqueeDown,speed)
rollmain.οnmοuseοver=function() {clearInterval(MyMar)}
rollmain.οnmοuseοut=function() {MyMar=setInterval(MarqueeDown,speed)}
*/
</script>
上下左右无间断滚动
最新推荐文章于 2021-03-02 14:56:48 发布