显示时图片有跳动，怎么修正一下？

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<div style="width:100%;height:212px;">
<div id="div1" style="cursor:pointer;position:absolute;width:315px;height:210px;overflow:hidden;border:-3px solid #CCCCCC" onmouseover="clearTimeout(scrl);" onmousemove="getpos()" onmouseout="change(1);"><img src=http://116.255.150.75:808/3601/1/chinama.jpg onload="change(1);"></div> 

<script> 
var scrl,direction="right"; 
var x,xold,xdiff, i=1; 

function change(start){ 
if(direction == "right"){ 
    if(div1.scrollTop+210 < div1.scrollHeight){ 
        div1.scrollTop += 210; 
    } 
    else{ 
        div1.scrollTop = 0; 
    } 
} 
else{ 
    if(div1.scrollTop-210 > 0){ 
        div1.scrollTop -= 210; 
    } 
    else{ 
        div1.scrollTop = div1.scrollHeight; 
    } 
} 
if(start) scrl = setTimeout("change(1)",100); 
else clearTimeout(scrl); 
} 

function getpos(){ 
x = event.clientX; 
xdiff = x - xold; 
xold = x; 
if(xdiff>0) direction = "right"; 
if(xdiff<0) direction = "left"; 
change(0); 
} 
</script>
</div>
</body>

</html>

这个在显示时，图片有一个跳动的现象，怎么修正？请高手指点，十在是不懂代码呀。

是不是这段代码引起的开始显示时的跳动：
if(start) scrl = setTimeout("change(1)",100);
else clearTimeout(scrl);

mg放到div或者li里面会到值div或者li莫名奇妙多3~5px的margin-bottom，将img转为块级元素可以修正这个bug

 <img src=http://116.255.150.75:808/3601/1/chinama.jpg onload="change(1);" border="0" style="display:block">

而且你的代码也不兼容标准浏览器，改成下面的

 <!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<div style="width:100%;height:210px;">
<div id="div1" style="cursor:pointer;position:absolute;width:315px;height:210px;overflow:hidden;C" onmouseover="clearTimeout(scrl);" onmousemove="getpos(event)" 

onmouseout="change(1);"><img src=http://116.255.150.75:808/3601/1/chinama.jpg onload="change(1);" border="0" style="display:block"></div> 
<style>body{margin:0px}</style>
<script> 
var scrl,direction="right"; 
var x,xold,xdiff, i=1; 
var div1=document.getElementById('div1')

function change(start){ 
if(direction == "right"){ 
    if(div1.scrollTop+210 < div1.scrollHeight){ 
        div1.scrollTop += 210; 
    } 
    else{ 
        div1.scrollTop = 0; 
    } 
} 
else{ 
    if(div1.scrollTop-210 > 0){ 
        div1.scrollTop -= 210; 
    } 
    else{ 
        div1.scrollTop = div1.scrollHeight; 
    } 
} 
if(start) scrl = setTimeout("change(1)",10); 
else clearTimeout(scrl); 
} 

function getpos(event){ 
x = event.clientX; 
xdiff = x - xold; 
xold = x; 
if(xdiff>0) direction = "right"; 
if(xdiff<0) direction = "left"; 
change(0); 
} 
</script>
</div>
</body>

</html>