日期:2014-05-16 浏览次数:20338 次
<!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>
</head>
<style type="text/css">
.slide{
width:600px;
height:280px;
position: relative;
}
.slide .box{position:relative;width:600px;height:280px;overflow: hidden;}
.slide .list{width:9999px;}
.slide .list li{float:left;width:600px;position: relative;}
</style>
<body>
<div id="slide" class="slide">
<div class="box">
<ul class="list clr">
<li >
<a href="#1">
<img src="images/slide.jpg" width="600" height="280"></a>
</li>
<li >
<a href="#1">
<img src="images/slide.jpg" width="600" height="280"></a>
</li>
<li >
<a href="#1">
<img src="images/slide.jpg" width="600" height="280"></a>
</li>
<li >
<a href="#1">
<img src="images/slide.jpg" width="600" height="280"></a>
</li>
<li >
<a href="#1">
<img src="images/slide.jpg" width="600" height="280"></a>
</li>
</ul>
</div>
</div>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(){
var n=-1;
var sw;
auto();
setInterval(auto, 5000);
function auto(){
n = n >= 4 ? 0 : ++n;
sw=n*600;
$("#slide .box").animate({"scrollLeft":(sw)});
}
});
</script>
<li >
<a href="#1">
<img src="images/slide.jpg" width="600" height="280"></a>
</li>
&nb