修改好的jquery滾動字幕效果實(shí)現(xiàn)代碼
更新時(shí)間：2011年06月22日 00:13:16 作者：
修改好的jquery滾動字幕效果，需要的朋友可以參考下。
最終效果圖
源代碼:
復(fù)制代碼 代碼如下:
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<script src="http://demo.jb51.net/jslib/jquery/jquery.js"></script>
<script type = "text/javascript">
function scroll_news(){
var $firstNode = $('#scroll-container li');
//得到 i的值 列數(shù)
var iRow = $('#scroll-container').find('li').length – 1;
//debugger;
$(function(){
$firstNode.eq(0).fadeOut('slow',function(){
$(this).clone().appendTo($(this).parent()).fadeIn('slow');
$(this).remove();
$firstNode.eq(iRow).hide();
});
});
}
$(document).ready(function(){
go();
});
function stop(){
clearInterval(sn);
}
function go(){
sn = setInterval('scroll_news()',2000);
}
</script>
<style type="text/css">
#scroll-container{border:1px #000 solid;background:#FEC;height:23px;line-height:23px;}
#scroll-container li{list-style:none;display:none;font-size:12px;}
li a{color:#F00;text-decoration:none;margin-left:10px;}
li a:hover{text-decoration:underline;}
</style>
</head>
<body>
<div id="scroll-container" onMouseOver="stop();" onMouseOut="go();">
<li><a href="#">一生這么一次</a></li>
<li><a href="#">不再因?yàn)槿涡远豢系皖^</a> </li>
<li><a href="#">不再因?yàn)楣虉?zhí)而輕言分手</a> </li>
<li><a href="#">堅(jiān)信一次</a> </li>
<li><a href="#">一顆心需要堅(jiān)定地去溫暖另一顆心</a> </li>
<li><a href="#">一直走</a> </li>
<li><a href="#">就可以到白頭</a> </li>
<li><a href="#">就那樣相守</a> </li>
<li><a href="#">在來往的流年里</a> </li>
<li><a href="#">歲月安好</a> </li>
<li><a href="#">惟愿這一生</a> </li>
<li><a href="#">執(zhí)子之手</a> </li>
<li><a href="#">與子偕老</a> </li>
</div>
</body>
</html>
相關(guān)文章
JQuery防止退格鍵網(wǎng)頁后退的實(shí)現(xiàn)代碼
有時(shí)我們需要防止退格鍵的網(wǎng)頁后退，一般情況下最好不要這么用，因?yàn)閷X體驗(yàn)不好2012-03-03
jQuery ajaxSubmit 實(shí)現(xiàn)ajax提交表單局部刷新
這篇文章主要介紹了jQuery ajaxSubmit 實(shí)現(xiàn)ajax提交表單局部刷新 的相關(guān)資料,非常不錯，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-07-07
使用jquery為table動態(tài)添加行的實(shí)現(xiàn)代碼
最近，有需要做一個(gè)動態(tài)的給table，添加行，用了點(diǎn)時(shí)間，算是做成了。已測試過，但如果發(fā)現(xiàn)有什么bug，可以留言，歡迎拍磚。大家一起進(jìn)步。2011-03-03
jQuery Validate 數(shù)組 全部驗(yàn)證問題
這篇文章主要介紹了jquery validate 數(shù)組 全部驗(yàn)證問題及解決辦法，非常不錯，具有參考借鑒價(jià)值，需要的朋友參考下吧2017-01-01
本文給大家分享jquery中map函數(shù)的兩種方式，非常不錯，具有參考借鑒價(jià)值，需要的朋友參考下吧2017-04-04
jQuery插件slick實(shí)現(xiàn)響應(yīng)式移動端幻燈片圖片切換特效
jQuery插件slick是一款響應(yīng)式、適用于移動設(shè)備觸摸屏、可滑動顯示的jQuery幻燈片插件。該幻燈片插件可以設(shè)置多種顯示效果，可以自動播放，是一款移動優(yōu)先的jQuery幻燈片插件。2015-04-04
jquery 取子節(jié)點(diǎn)及當(dāng)前節(jié)點(diǎn)屬性值的方法
這篇文章主要介紹了jquery 取子節(jié)點(diǎn)及當(dāng)前節(jié)點(diǎn)屬性值的方法,比較適合新手，也比較實(shí)用，需要的朋友可以參考下2014-08-08
jQuery完成表單驗(yàn)證的實(shí)例代碼(純代碼)
這篇文章主要介紹了jquery完成表單驗(yàn)證的實(shí)例代碼，代碼簡單易懂,需要的朋友可以參考下2017-09-09
jquery實(shí)現(xiàn)不同大小瀏覽器使用不同的css樣式表的方法
這篇文章主要介紹了jquery實(shí)現(xiàn)不同大小瀏覽器使用不同的css樣式表的方法,需要的朋友可以參考下2014-04-04
Jquery網(wǎng)頁內(nèi)滑動緩沖導(dǎo)航的實(shí)現(xiàn)代碼
這篇文章主要介紹了Jquery網(wǎng)頁內(nèi)滑動緩沖導(dǎo)航的實(shí)現(xiàn)代碼,實(shí)現(xiàn)滑動緩沖的方式實(shí)現(xiàn)頁內(nèi)導(dǎo)航，用戶體驗(yàn)大大提升需要的朋友可以參考下2015-04-04