<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style type="text/css">
img{width:755px;height:388px;margin:0px;}
</style>
</HEAD>
<BODY>
<div id="demo" style="float:left;overflow:hidden;height:388px;line-height:22px;width:755px;color:black">
<div style="width:4610px;height:388px;" >
<div id="demo1" style="float:left;">
<img alt="" src="http://img03.taobaocdn.com/tps/i3/T1SV0SXilCXXXXXXXX-770-300.jpg">
<img alt="" src="http://img.alimama.cn/bcrm/adboard/picture/2010-11-22/101122110857581.jpg">
<img alt="" src="http://img03.taobaocdn.com/tps/i3/T1EHNSXfxXXXXXXXXX-770-300.jpg">
</div>
<div id="demo2" style="float:left;"></div>
</div>
</div>
<div class="clear"></div>
<script type="text/javascript">
var demo2 = document.getElementById("demo2");
var demo1 = document.getElementById("demo1");
var demo = document.getElementById("demo");
demo2.innerHTML=demo1.innerHTML;
var speed=8;
function Marquee(){
//当显示到demo2的最后一张图片时,就将画面移回demo1的最后一张图片
if(demo.scrollLeft>=(demo.scrollWidth-755)){
var offsetWidth = demo2.offsetWidth;
var scrollLeft = demo.scrollLeft;
demo.scrollLeft-=demo2.offsetWidth;
} else {
demo.scrollLeft++;
}
}
var MyMar=setInterval(Marquee,speed)
demo.οnmοuseοver=function() {clearInterval(MyMar)}
demo.οnmοuseοut=function() {MyMar=setInterval(Marquee,speed)}
</script>
</BODY>
</HTML>