HTML代码:
<div id="top_message"><span style="font-size:19px; position:absolute;">☞</span><ul id="uuTxt"><li><a href="#">四年延保,大学放肆耍!</a></li><li><a href="#">MOTO首发,你还在等什么?</a></li><li><a href="#">注册会员即送乐豆,评论、晒单乐豆十倍送,100乐豆=1元哦!</a></li></ul></div>
CSS代码:
#top_message{font-size:13px; border-bottom:1px solid #ccc; height:86px; overflow:hidden;}#top_message a{color:#000; display:block; text-indent:2em; line-height:20px;padding-top:5px; height:86px;}#top_message a:hover{color:#F00;}
JS代码:
// 公告栏文字向上滚动var uuTxt = document.getElementById("uuTxt");var roll = 0; //滚动距离function scrollTop() {roll -= 10;uuTxt.style.marginTop = roll + "px";if (roll < -182) {roll = 91}}//定时器滚动var timer = setInterval(scrollTop, 400);//鼠标悬停清除定时器uuTxt.onmouseover = function() {clearInterval(timer);}//鼠标离开启动定时器uuTxt.onmouseout = function() {timer = setInterval(scrollTop, 400);}