jquery实现内容滚动HTML代码:
<div class="scollNews">
<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>
jquery代码:
$(function(){
var settime;
$(".scollNews").hover(function(){
clearInterval(settime);
},function(){
settime=setInterval(function(){
var $first=$(".scollNews 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");    //⾃动触发元素的制定事件类型html滚动效果代码
})
注:只要修改动画时间就可以控制滚动的速度。

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。