首页 > 其他 > 详细

新闻滚动

时间:2017-12-06 20:38:52      阅读:171      评论:0      收藏:0      [点我收藏+]

技术分享图片   --------------------->  技术分享图片 -------------------->  技术分享图片

 

  1. 获取第一个元素,appendTo到结构中
  2. setInterval每timer秒执行上个操作
  3. 鼠标移入清除 clearInterval
.myDiv{height:200px;overflow:hidden;}
li{height:50px;line-height:50px;}
<div class="myDiv">
  <ul>
    <li>000</li>
    <li>111</li>
    <li>222</li>
    <li>333</li>
    <li>444</li>
    <li> . . . </li>
  </ul>
</div>
<script>
var myDiv=$(".myDiv");
var countDown=1000;
var timer;
myDiv.hover(function(){
  clearInterval(timer);
},function(){
  timer=setInterval(function(){
    var first=myDiv.find("li:first");
      var lineHeight=first.height(); 
    first.animate({marginTop:-lineHeight+"px"},500,function(){
      first.appendTo("ul").css({marginTop:0});
    })
  },countDown)
}).trigger("mouseleave");//页面载入默认执行
</script>

 

新闻滚动

原文:http://www.cnblogs.com/mudeng-007/p/7994461.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!