<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery-1.11.3.js"></script>
<script>
$(function(){
var settime;
$(".news").hover(function(){
clearInterval(settime);
},function(){
settime=setInterval(function(){
var $first=$(".news ul:first"); //获取类名下的第一个ul
var height=$first.find("li:first").height(); //获取第一个li的高
$first.animate({"marginTop":-height+"px"},100,function(){
$first.css({marginTop:0}).find("li:first").appendTo($first); //设置上边距为零，为了下一次移动做准备
});
},1000);
}).trigger("mouseleave"); //自动触发元素的制定事件类型
})
</script>
</head>
<body>
<div class="news">
<ul>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">6</a></li>
<li><a href="#">7</a></li>
<li><a href="#">8</a></li>
<li><a href="#">9</a></li>
<li><a href="#">10</a></li>
</ul>
</div>
</body>
</html>
注解：定时器的1000是根据li的根数来计算的
li的个数乘以animate设置的时间值 == 定时器时间
4277
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
