源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

jquery无缝向上滚动实现代码

  • 时间:2022-09-09 08:53 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jquery无缝向上滚动实现代码
[b]JS部份[/b]
[u]复制代码[/u] 代码如下:
$(function(){ var $this = $(".renav"); var scrollTimer; $this.hover(function(){ clearInterval(scrollTimer); },function(){ scrollTimer = setInterval(function(){ scrollNews( $this ); }, 2000 ); }).trigger("mouseout"); }); function scrollNews(obj){ var $self = obj.find("ul:first"); var lineHeight = $self.find("li:first").height(); $self.animate({ "margin-top" : -lineHeight +"px" },600 , function(){ $self.css({"margin-top":"0px"}).find("li:first").appendTo($self); }) }
[b]HTML部份[/b]
[u]复制代码[/u] 代码如下:
<style type="text/css"> .renav{ width:200px; height:150px; line-height:21px; overflow:hidden; background:#FFFFFF; } .renav li{ height:21px; } </style> <div class="renav"> <ul style="margin-top: 0px;"> <li><a>罗氏</a></li> <li><a>瑞声达</a></li> <li><a>未添加1</a></li> <li><a>未添加2</a></li> <li><a>未添加3</a></li> <li><a>未添加4</a></li> <li><a>西门子</a></li> <li><a>欧姆龙</a></li> </ul> </div>
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部