一种文化
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Document</title> <style> *{margin:0; padding:0;} #box{width:500px; overflow:hidden;} #imgs{width:100000px;} #imgs img{float:left;} </style> <script src="../../js11-jq02/jquery-1.7.2.min.js"></script></head><body> <div id="box"> <div id="imgs"> <img src="imgs/1.jpg" width="500" alt="" /> <img src="imgs/2.jpg" width="500" alt="" /> <img src="imgs/3.jpg" width="500" alt="" /> <img src="imgs/4.jpg" width="500" alt="" /> <img src="imgs/5.jpg" width="500" alt="" /> </div> </div></body><script> var current = 1; var width = $('#imgs img').width(); function start(){ setInterval(function(){ //判断是否超出图片数 if(current >= $('#imgs img').length) current = 0; var left = current * -width; $('#imgs').animate({'marginLeft':left + 'px'}, 300); current++; }, 500) } start(); //鼠标移动上去停止 //增加一些数字按钮，同样有鼠标事件</script></html>