前提:
今天老大让做一个友情链接滚动的效果,然后查了一下代码,用dw本地测试成功,先看一下代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div id="demo" style="overflow: hidden; height: 139px; width: 232px; background: rgb(244, 244, 244) none repeat scroll 0% 0%; color: rgb(255, 255, 255);">
<div id="demo1">
1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br>10<br>11<br>12<br>13<br>14<br>15<br>16<br>
</div>
<div id="demo2" ></div>
</div>
<script>
var speed=50
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>
</body>
</html>
拿到项目中,数据循环一次就停止了。你是不是也碰到这种情况?
分析了一下原因:我的项目中的数据是从数据库中通过js获得并赋得值,而测试的都是本地的数据。根据这种情况我在项目中手动写死了几条数据,然后就可以了。
注意:手动写死的数据要超过你的窗口高度,需要内容比窗口大才能循环滚动。