//無縫滾動function AutoScroll(obj) {var autoScrollTimer=null,timer=null;timer=setTimeout(function(){move();},3000);function move(){clearTime(autoScrollTimer);var liLen= $(obj).find('li').length;if(liLen === 1){//此處處理只有一條數據時 跳動效果$(obj).find("ul:first").append($(obj).find('li').eq(0).clone())}$(obj).find("ul:first").animate({marginTop: "-25px"}, 500, function() {$(this).css({marginTop: "0px"}).find("li:first").appendTo(this);});autoScrollTimer=window.setTimeout(move,3000);}function clearTime(time){clearTimeout(time);time=null;}$(obj).find('li').hover(function(){clearTime(autoScrollTimer);},function(){move()})}$(function(){//無縫滾動$(document).ready(function() {AutoScroll("#jvsNotice")//調用 }); }） <div class="jvsNotice" id="jvsNotice"><ul><li><a href="#">公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1公告1</a></li><li><a href="#">公告3公告3公告3公告3</a></li><li><a href="#">公告4公告4公告4公告4</a></li><li><a href="#">公告5公告5</a></li><li><a href="#">公告6公告6</a></li><li><a href="#">公告7公告7公告7</a></li><li><a href="#">公告8公告8公告8公告8</a></li></ul> </div> *{margin:0;padding:0;}ul,ol,dl{list-style: none;}.jvsNotice {height: 25px;line-height: 25px;border: #ccc 1px solid;overflow: hidden;}.jvsNotice>ul{padding-left: 0;overflow: hidden;}.jvsNotice li {height: 25px;padding-left: 10px;text-align: center;white-space: nowrap;}

?

轉載于:https://www.cnblogs.com/dongxiaolei/p/9687572.html

總結

以上是生活随笔為你收集整理的仿 腾讯新闻快讯 --无缝滚动的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。