想實(shí)現(xiàn)一個(gè)類似跑馬燈的效果,發(fā)現(xiàn)跑馬燈有空格.效果也不美觀,于是用jquery寫了個(gè)
頁面代碼
<div class=recordlist>
<ul class=tpl-rotate-recordlist style=margin-top: 0px;>
<li class=tpl-rotate-recordlist-item>
恭喜187****5204獲得1000rbm
</li>
<li class=tpl-rotate-recordlist-item>
恭喜137****1372獲得1000rbm
</li>
<li class=tpl-rotate-recordlist-item>
恭喜156****0276獲得1000rbm
</li>
<li class=tpl-rotate-recordlist-item>
恭喜139****9856獲得1000rbm
</li>
<li class=tpl-rotate-recordlist-item>
恭喜136****0580獲得1000rbm
</li>
<li class=tpl-rotate-recordlist-item>
恭喜136****0580獲得1000rbm
</li>
<li class=tpl-rotate-recordlist-item>
恭喜138****8118獲得1000rbm
</li>
<li class=tpl-rotate-recordlist-item>
恭喜136****5555獲得1000rbm
</li>
<li class=tpl-rotate-recordlist-item>
恭喜136****0580獲得1000rbm
</li>
<li class=tpl-rotate-recordlist-item>
恭喜136****0580獲得1000rbm
</li>
</ul>
</div>
js代碼
/*自動(dòng)輪換xuyw*/
var autoscroll = function(a) {
$(a).find(ul:first).animate( {
margintop : -20px
}, 500, function() {
$(this).css( {
margintop : 0px
}).find(li:first).appendto(this)
})
}
if ($(.recordlist ul li).length > 0) {
setinterval('autoscroll(.recordlist)', 2000)
} else {
$(.recordlist).hide()
}