图片向右滚动:
<html>
<script language="javascript">
function marqueeImage()
{
if(imageDiv.scrollLeft<=0)
{
imageDiv.scrollLeft+=imageTd.offsetWidth;
}
else
{
imageDiv.scrollLeft--;
}
}
function iniMarqueeImage()
{
imageDiv.scrollLeft=imageTd.offsetWidth;
imageTdTemp.innerHTML=imageTd.innerHTML;
imageDiv.onmouseover=function(){clearInterval(myTime)}
imageDiv.onmouseout=function(){myTime=setInterval(marqueeImage,speed)}
}
var speed=30;
var myTime=setInterval(marqueeImage,speed);
window.onload=iniMarqueeImage;
</script>
<body>
<div id="imageDiv" style="overflow:hidden;height:120px;width:300px;">
<table border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td id="imageTd"><img src="1.jpg" width="150" height="120"><img src="2.jpg" width="150" height="120"></td>
<td id="imageTdTemp"></td>
</tr>
</table>
</div>
</body>
</html>
图片向左滚动:
<html>
<script language="javascript">
function marqueeImage()
{
if(imageTd.offsetWidth-imageDiv.scrollLeft<=0)
{
imageDiv.scrollLeft-=imageTd.offsetWidth;
}
else
{
imageDiv.scrollLeft++;
}
}
function iniMarqueeImage()
{
imageTdTemp.innerHTML=imageTd.innerHTML;
imageDiv.onmouseover=function(){clearInterval(myTime)}
imageDiv.onmouseout=function(){myTime=setInterval(marqueeImage,speed)}
}
var speed=30;
var myTime=setInterval(marqueeImage,speed);
window.onload=iniMarqueeImage;
</script>
<body>
<div id="imageDiv" style="overflow:hidden;height:120px;width:300px;">
<table border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td id="imageTd"><img src="1.jpg" width="150" height="120"><img src="2.jpg" width="150" height="120"></td>
<td id="imageTdTemp"></td>
</tr>
</table>
</div>
</body>
</html>
注意:imageTd中的所有图片的宽度之和应该等于imageDiv的width
