|
之所以拋棄marquee是因為marquee是一個嚴重影響用戶體驗的東西,你把數十行內容壓縮到幾行滾動的確幫助你壓縮了排版空間,但你有沒有想過用戶可能因為想閱讀其中一兩行的內容而不得不在你這個滾動上等半天?就以經典論壇頁面上部“BlogBeta 數字引擎p4 3.0服務器只要6999元/年”廣告文字右邊的聚合文字滾動為例,你覺得這是一個很好的用戶體驗么?W3C的專家們難道還不如一群無知的小p孩考慮的周全?簡直是笑話
第一種方法:用Javascript模擬marquee的做法。
出處:網易游戲
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]
個人觀點:從web可用性角度上講,我們在采用這段代碼的同時要考慮到noscript環境下的可用性,建議將內容還是以下邊代碼的形式出現在頁面中。如:
程序代碼
復制代碼 代碼如下:
<div id="newslist">
<ul>
<li><a href=http://xyq.163.com/news/2006/11/2-2-20061102170913.html target=_blank>用“夢幻密保”快速取回帳號密碼</a></li>
<li><a href=http://ekey.163.com/ target=_blank>網易將軍令官方網站</a></li>
<li><a href=http://xyq.163.com/download/wallpaper.htm target=_blank>最新壁紙下載</a></li>
<li><a href=http://xyq.163.com/download/around.htm target=_blank>最新屏保下載</a></li>
</ul>
</div>
然后用腳本去設置隱藏,將列表項讀進Javascript中定義的數組中。即可達到在noscript環境下也能正常看到內容列表。
第二種方法:這個更強,能自動根據內容自動進行左右滾動,解決了寬度太小造成的截取問題。
原文作者:風動人
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]
個人觀點:從xhtml的語義化的角度看,頁面內容中濫用div標簽現象比較嚴重,可改成ul/li形式。
第三種是最精簡的,代碼非常少。
原文作者:cityvoice
HTML代碼
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]
個人觀點:太短小精干了,如果你喜歡簡單的話,這個也可以考慮的。
JavaScript技術:用javascript實現代替marquee的滾動字幕效果代碼,轉載需保留來源!
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。