菜鸟求教~一个关于javascript实现的图片横向滚动的问题。但滚动会越来越卡~
html代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>scroll</title>
<style type="text/css">
#demo0{
width:1206px;
height:150px;
overflow:hidden;
margin:200px 0px 0px 0px;
}
#demo0 img{
float:left;
margin-left:4px;
border:0px;
}
#indemo0{
float:left;
width:800%;
}
#demo10{
float:left;
}
#demo20{
float:left;
}
</style>
</head>
<body onkeydown="move();">
<div id="demo0">
<div id="indemo0">
<div id="demo10">
<img id="pic1" src="img/1.jpg" width="200" height="140" border="0"/>
<img id="pic2" src="img/2.jpg" width="200" height="140" border="0"/>
<img id="pic3" src="img/3.jpg" width="200" height="140" border="0"/>
<img id="pic4" src="img/4.jpg" width="200" height="140" border="0"/>
<img id="pic5" src="img/5.jpg" width="200" height="140" border="0"/>
<img id="pic6" src="img/6.jpg" width="200" height="140" border="0"/>
<img id="pic7" src="img/7.jpg" width="200" height="140" border="0"/>
<img id="pic8" src="img/8.jpg" width="200" height="140" border="0"/>
<img id="pic9" src="img/9.jpg" width="200" height="140" border="0"/>
</div>
<div id="demo20"></div>
</div>
</div>
<script language="javascript">
var tabb=document.getElementById("demo0");
var tabb1=document.getElementById("demo10");
var tabb2=document.getElementById("demo20");
tabb.scrollLeft=116;
tabb2.innerHTML=tabb1.innerHTML;
function move(){
var i=0;
if(event.keyCode==37){
setInterval(Marquee1,30);
function Marquee1(){
i=i+1;
if(i<=204){
if(tabb2.offsetWidth-tabb.scrollLeft<=0){
tabb.scrollLeft=tabb.scrollLeft-tabb1.offsetWidth+1;
}
else{
tabb.scrollLeft++;
}
}
}
}
if(event.keyCode==39){
setInterval(Marquee2,30);
function Marquee2(){
i=i+1;
if(i<=204){
if(tabb.scrollLeft<=0)
tabb.scrollLeft=tabb.scrollLeft+tabb2.offsetWidth-1;
else{
tabb.scrollLeft--;
}
}
}
}
}
</script>
</body>
</html>
这个程序由左右键控制图片滚动,可是为什么当滚动次数多了之后,滚动就变得越来越卡了? 怎么才能解决这个问题?求教啊~~~~急~~~