<!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=gb2312" /> 
<title>js图片无缝平滑滚动代码_
脚本学堂_www.jb200.com</title> 
</head> 
<body> 
<style type="text/css"> 
<!-- 
#demo { 
background: #fff; 
overflow:hidden; 
border: 1px dashed #ccc; 
width: 500px; 
} 
#demo img { 
border: 3px solid #f2f2f2; 
} 
#indemo { 
float: left; 
width: 800%; 
} 
#demo1 { 
float: left; 
} 
#demo2 { 
float: left; 
} 
--> 
</style> 
<div id="demo"> 
<div id="indemo"> 
<div id="demo1"> 
<a href="#"><img src="/jscss/demoimg/wall_s1.jpg" border="0" /></a> 
<a href="#"><img src="/jscss/demoimg/wall_s2.jpg" border="0" /></a> 
<a href="#"><img src="/jscss/demoimg/wall_s3.jpg" border="0" /></a> 
<a href="#"><img src="/jscss/demoimg/wall_s4.jpg" border="0" /></a> 
<a href="#"><img src="/jscss/demoimg/wall_s5.jpg" border="0" /></a> 
<a href="#"><img src="/jscss/demoimg/wall_s6.jpg" border="0" /></a> 
</div> 
<div id="demo2"></div> 
</div> 
</div> 
<script> 
<!-- 
var speed=10; 
var tab=document.getelementbyid("demo"); 
var tab1=document.getelementbyid("demo1"); 
var tab2=document.getelementbyid("demo2"); 
tab2.innerhtml=tab1.innerhtml; 
function marquee(){ 
if(tab2.offsetwidth-tab.scrollleft<=0) 
tab.scrollleft-=tab1.offsetwidth 
else{ 
tab.scrollleft++; 
} 
} 
var mymar=setinterval(marquee,speed); 
tab.onmouseover=function() {clearinterval(mymar)}; 
tab.onmouseout=function() {mymar=setinterval(marquee,speed)}; 
--> 
</script> 
</body> 
</html>