<div id="oDiv"> <ul id="oUl"> <li>第1個li元素</li> <li>第2個li元素</li> <li>第3個li元素</li> <li>第4個li元素</li> <li>第5個li元素</li> <li>第6個li元素</li> <li>第7個li元素</li> <li>第8個li元素</li> </ul> </div>
可是頁面只顯示前5個li(相關css不作贅述),想要循環顯示li裏面的內容就是在制定的時間將ul向上移動li的高度,於此同時將第一個li加到ul中li的末尾。
代碼以下:css
function autoScroll(obj, ul_bz){ $(obj).find(ul_bz).animate({ marginTop : "-25px" },500,function(){ $(this).css({marginTop : "0px"}).find("li:first").appendTo(this); }); } setInterval('autoScroll("#oDiv", "#oUl")',3000)