本篇文章给大家带来的内容是关于如何利用JavaScript&jQuery实现滚动公告栏(代码实例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

首先看HTML结构,css样式这里不再给出
<div> <div> <div> <ul> <li>・2010考研英语大纲到货75折...</li> <li>・权威定本四大名著(人民文...</li> <li>・口述历史权威唐德刚先生国...</li> <li>・袁伟民与体坛风云:实话实...</li> <li>・我们台湾这些年:轰动两岸...</li> <li>・畅销教辅推荐:精品套书50...</li> <li>・2010版法律硕士联考大纲75...</li> <li>・计算机新书畅销书75折抢购</li> <li>・2009年孩子最喜欢的书>></li> <li>・弗洛伊德作品精选集59折</li> <li>・畅销教辅推荐:精品套书50...</li> </ul> </div> </div> </div>
js代码
请首先确保已经引入jQuery
//滚动字
//确保绝对定位
//使用定时函数
var top=0; var t = setInterval(function () { //先设置margin-top为0
$("#express li:first").css("margin-top",top); //li的高度为25,故这里以25判断第一行是否走出ul。
if(top<p>额外的代码</p><p>实现当滚动时,鼠标放置后可以停止,移出时仍可以进行</p><pre class="brush:js;toolbar:false">//当鼠标放置后停止,松开继续走
$("#express li").hover(function() { //清除定时
clearInterval(t);
}, function() {
t = setInterval(function () { //先设置margin-top为0
$("#express li:first").css("margin-top",top); //li的高度为25,故这里以25判断第一行是否走出ul。
if(top<p>以上就是对如何利用JavaScript&jQuery实现滚动公告栏(代码实例)的全部介绍,如果您想了解更多有关<a href="http://www.php.cn/course/list/17.html" target="_self">JavaScript教程</a>,请关注PHP中文网。</p><p> </p>
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











