工作(zuò)中會(huì)遇到這種情況，要在有(yǒu)限的網頁空(kōng)間(jiān)裏放下大(dà)段的文字內(nèi)容，我們會(huì)想到用到文字滾動效果。文字滾動效果能充分利用網頁的空(kōng)間(jiān)、有(yǒu)效地增加網頁的內(nèi)容，可(kě)以把新聞、最新文章、或者網站(zhàn)最新公告等顯示在較小(xiǎo)的空(kōng)間(jiān)裏。

曾記得(de)幾年前的網絡世界裏，随便打開(kāi)一個(gè)網站(zhàn)，首頁飄來(lái)飄去的圖片廣告、來(lái)回跑動的文字（還(hái)帶顔色閃爍效果）比比皆是。各大(dà)站(zhàn)長将此效果發揮到極限。可(kě)是，近年來(lái)，大(dà)家(jiā)會(huì)發現，那(nà)種飄來(lái)飄去和(hé)跑動的元素少(shǎo)了。為(wèi)什麽呢？用戶體(tǐ)驗！衆多(duō)的不友(yǒu)好網頁元素被舍棄，網頁終于安靜了許多(duō)。

原始的文字滾動效果，是許多(duō)設計(jì)者直接通(tōng)過DW裏的控件直接設置，于是生(shēng)成了文字滾動（跑馬燈）效果。筆者不贊成此方法，原因有(yǒu)筆者很(hěn)少(shǎo)使用DW生(shēng)成代碼，多(duō)是手寫代碼；另一個(gè)是要告訴大(dà)家(jiā)是用于文字滾動的标簽Marquee不符合W3C标準，W3C一直不承認Marquee。

那(nà)麽就有(yǒu)好多(duō)解決方案了，當然目标集中在Javascript上(shàng)。

筆者推薦一個(gè)非常好用的文字滾動jquery插件，依托jquery庫，能實現各種滾動效果，且讓HTML代碼符合W3C标準。

如何使用?

1、加載javascript。

2、加入CSS樣式。

ul.marquee {display: block;line-height: 1;position: relative;overflow: hidden;width: 400px;
height: 22px; }
ul.marquee li {position: absolute; top: -999em;left: 0;display: block;
white-space: nowrap; padding: 3px 5px; text-indent:0.8em;}

3、HTML代碼如下：

	
	

		 DIV+CSS網頁布局對網站(zhàn)搜索引擎優化的影(yǐng)響 [2010-08-20]
	

	

		 jFlow：jQuery內(nèi)容滑動特效插件的應用 [2010-08-17]
	

	

		 Open Flash Chart + PHP + Mysql生(shēng)成動态圖表 [2010-08-16]
	

該插件提供了許多(duō)屬性選項，您可(kě)以配置定制(zhì)外觀和(hé)效果。

{
         yScroll: "top"        // 初始滾動方向 (還(hái)可(kě)以是"top" 或 "bottom")
       , showSpeed: 850        // 初始下拉速度
       , scrollSpeed: 12       // 滾動速度
       , pauseSpeed: 5000      // 滾動完到下一條的間(jiān)隔時(shí)間(jiān)
       , pauseOnHover: true    // 鼠标滑向文字時(shí)是否停止滾動
       , loop: -1              // 設置循環滾動次數(shù) （-1為(wèi)無限循環）
       , fxEasingShow: "swing"  // 緩沖效果
       , fxEasingScroll: "linear"  // 緩沖效果
       , cssShowing: "marquee-showing"  //定義class

       // event handlers
       , init: null                // 初始調用函數(shù)
       , beforeshow: null           // 滾動前回調函數(shù)
       , show: null                 // 當新的滾動內(nèi)容顯示時(shí)回調函數(shù)
       , aftershow: null            // 滾動完了回調函數(shù)
}

jquery.marquee.js可(kě)以到官網地址下載：http://www.givainc.com/labs/marquee_jquery_plugin.htm