[Blog] 製作跑馬燈式的最近閱讀書籍清單

昨天在Blog上裝上跑馬燈式的最近閱讀的書籍清單,以下列出作法供需要者參考(範例請看我Blog首頁)。

插入自由欄位的HTML原始碼:

  onmouseover="this.stop();" onmouseout="this.start();" align="center">
 
    思考的技術
 


 
    宏碁的世紀變革
 

 

剛讀完的書:
 

  豐臣秀長

  你的桶子有多滿?
 

有空時會看的日劇-水男孩:
 

 
    水男孩
 





分段解說如下:

<marquee scrollamount="1″ direction="up" width="200″ height="120″
  onmouseover="this.stop();" onmouseout="this.start();" align="center">
marquee是用來製作跑馬燈式的捲動式文字;使用的屬性說明如下:

  • scrollamount: 一次捲動多少像素
  • direction: 捲動方向;up=向上捲動
  • width、height: 作用範圍寬、高各200px與120px
  • onmouseover: 滑鼠一移入就停止捲動
  • onmouseout: 滑鼠一移出就開始捲動
  • align: 置中顯示
  <a href="http://www.books.com.tw/exep/prod/booksfile.php?item=0010287518&"
          target="_blank">
    <img alt="思考的技術" src="http://addons.books.com.tw/G/8/0010287518.jpg"/>
  </a>
放入超連結

  • href: 連結到指定的網址
  • target: _blank代表將網址開啟到新的視窗

再用加入書籍的圖形檔;為了怕可能讀不到指定網站的圖檔,必須用 alt 指定顯示用的文字

<hr size="1″ color="green">  畫一條1像素的橫線(Horizontal Rule)
            target="_blank">
    宏碁的世紀變革           src="http://www.bookzone.com.tw/book/bkimages/book/P_CB301.gif"/>
 
再加第二本書
 

剛讀完的書:
 

  豐臣秀長

  你的桶子有多滿?
 
用超連結的方式顯示另兩本書
marquee> 結束

另外,要特別提醒大家的:

Xuite的自由欄位在修改模式下,會把英文全部轉成小寫,如果指定網址不是運作在Windows系統,那麼網址的大小寫是不一樣的,因此修改時必須特別注意網址是否被轉掉了;例如「思考的技術」這本書使用博客來的圖檔,網址是:

http://addons.books.com.tw/G/8/0010287518.jpg

網址中有個大寫的G,修改時都被轉成小寫,導致捲動時因找不到圖檔而出現紅叉叉。
這個茶包...害我浪費好多時間...

您可能也會有興趣的類似文章

8 則留言 »[Blog] 製作跑馬燈式的最近閱讀書籍清單

填寫回應

 

 

 

您可使用這些HTML標籤

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">

隨機文章

  1. [iReport] 列印名條標籤 
  2. 接聽電話後重新顯示螢幕的偵測軟體:Touch InCall Screen Tweak 
  3. 長頸鹿的眼淚:溫馨感人的偵探故事 
  4. [Database] Aqua Data Studio 4.0.2推出 
  5. IntelliJ IDEA直接開啟專案的方法 
  6. 13個Web 2.0的網路服務 
  7. [QNAP NAS] 用SQLite Manager讀取pyLoad資料 
  8. 簡單放大Plurk輸入區的方法[修訂] (6)
  9. [Misc] 無名小站的RSS失效? (2)
  10. 重新安裝NAS TS-109 (2)

歷史熱門文章

  1. 如何手動輸入Plurk的表情圖示? (367,772 點擊/2008-09-29)
  2. 啟用&關閉中華電信ZyXEL P874的無線網路連線功能的步驟[修訂] (118,724 點擊/2011-06-01)
  3. Plurk CSS樣式自訂修改全攻略 (89,203 點擊/2009-07-04)
  4. 簡單放大Plurk輸入區的方法[修訂] (88,799 點擊/2008-09-29)
  5. 網路升級光世代50M/3M與設定ZyXEL P874 (71,282 點擊/2011-05-28)
  6. 輕鬆學會彈指神功-揭露AutoHotkey絕技 (50,585 點擊/2008-04-10)
  7. iPad新手入門技巧 (48,891 點擊/2011-02-05)
  8. iPad鍵盤輸入全攻略 (42,274 點擊/2011-01-01)
  9. 分享世博台灣館主題曲『台灣的心跳聲』MV(附歌詞+下載連結+新歌詞) (40,754 點擊/2010-04-27)
  10. 調整Windows 7環境: 加回工作列的「顯示桌面」圖示 (40,550 點擊/2010-01-02)