仿京東快報向上滾動的實(shí)例
更新時間：2017年12月13日 10:18:11 作者：璁璁那~年
下面小編就為大家分享一篇仿京東快報向上滾動的實(shí)例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
實(shí)例如下：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<div id="broadcast" class="bar" name="giftactive">
<div style="float:left"><strong>間隔滾動效果：</strong></div>
<div id="demo" style="overflow:hidden;height:22px;line-height:22px;">
<ul class="mingdan" id="holder">
<li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" target="_blank">aaaaaa</a></li>
<li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" target="_blank">bbbbbb</a></li>
<li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" target="_blank">cccccc</a></li>
<li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" target="_blank">dddddd</a></li>
<li><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" target="_blank">eeeeee</a></li>
</ul>
</div>
</div>
<script type="text/javascript">
function AutoScroll(obj) {
$(obj).find("ul:first").animate({
marginTop: "-22px"
}, 500, function() {
$(this).css({ marginTop: "0px" }).find("li:first").appendTo(this);
});
}
$(document).ready(function() {
setInterval('AutoScroll("#demo")', 1000)
});
</script>
</body>
</html>
以上這篇仿京東快報向上滾動的實(shí)例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
原生js實(shí)現(xiàn)each方法實(shí)例代碼詳解
這篇文章主要介紹了原生js實(shí)現(xiàn)each方法,需要的朋友可以參考下2019-05-05
這篇文章主要介紹了JS顯示表格內(nèi)指定行html代碼的方法,涉及javascript獲取行及innerHTML屬性的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03
JavaScript數(shù)據(jù)結(jié)構(gòu)之二叉樹的刪除算法示例
這篇文章主要介紹了JavaScript數(shù)據(jù)結(jié)構(gòu)之二叉樹的刪除算法,簡單分析了javascript刪除數(shù)據(jù)結(jié)構(gòu)中二叉樹節(jié)點(diǎn)時所遇到的各種情況與相關(guān)的處理原理與算法實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-04-04
通過JS動態(tài)創(chuàng)建一個html DOM元素并顯示
需要通過點(diǎn)擊某個元素后， 動態(tài)創(chuàng)建一個DOM元素并顯示，因此寫了一些相關(guān)的js函數(shù)，在此記錄下2014-10-10
這篇文章主要介紹了通過實(shí)例解析js可枚舉屬性與不可枚舉屬性,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-12-12
d3.js 地鐵軌道交通項(xiàng)目實(shí)戰(zhàn)
這篇文章主要介紹了d3.js 地鐵軌道交通項(xiàng)目實(shí)戰(zhàn),本文通過實(shí)例代碼項(xiàng)目截圖給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值，需要的朋友可以參考下2019-11-11
js實(shí)現(xiàn)拖拽 閉包函數(shù)詳細(xì)介紹
在開發(fā)過程中可能會使用js實(shí)現(xiàn)拖拽等相關(guān)功能，本文將以此問題進(jìn)行深入介紹，需要了解的朋友可以參考下2012-11-11
學(xué)習(xí)Typescript通常是一個重新發(fā)現(xiàn)的過程。這篇文章為大家整理了十個你必須要會的TypeScript技巧，希望對大家學(xué)習(xí)TypeScript有所幫助2023-06-06
本篇文章主要介紹了Webpack DLL 用法詳解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-08
一個按鈕可以在短時間內(nèi)多次點(diǎn)擊，那么有可能會被用戶惡意點(diǎn)擊，下面有個不錯的方法可以有效制止，希望對大家有所幫助2014-03-03