<script type="text/javascript" src="jquery.js"></script> <DIV style="OVERFLOW: hidden;height: 200px;background-color:yellow;" class=sidlis> <UL id=ticker> <li>测试一下滚动条</li> <li>测试一下滚动条</li> <li>测试一下滚动条</li> <li>测试一下滚动条</li> <li>测试一下滚动条</li> <li>测试一下滚动条</li> <li>测试一下滚动条</li> <li>测试一下滚动条</li> <li>测试一下滚动条</li> <li>测试一下滚动条</li> </UL> <!-- 公告栏目的滚动效果 --> <SCRIPT type=text/javascript> $(function() { var ticker = $("#ticker"); ticker.children().filter("li").each(function() { var dt = $(this), container = $("<div>"); dt.next().appendTo(container); dt.prependTo(container); container.appendTo(ticker); }); ticker.css("overflow", "hidden"); function animator(currentItem) { var distance = currentItem.height(); duration = (distance + parseInt(currentItem.css("marginTop"))) / 0.015; currentItem.animate({ marginTop: -distance }, duration, "linear", function() { currentItem.appendTo(currentItem.parent()).css("marginTop", 0); animator(currentItem.parent().children(":first")); }); }; animator(ticker.children(":first")); ticker.mouseenter(function() { ticker.children().stop(); }); ticker.mouseleave(function() { animator(ticker.children(":first")); }); }); </SCRIPT> </DIV>