為您的部落格打造一個 Dock Menu ！

本文於 七月 6th, 2007 由 Allen Yang 發佈。
文章歸類：Blog / 網頁設計 / 資訊科技。
文章標簽： / / 。
 

N.Design Studio - Blog & Design

在 N.Design Studio – Blog & Design 上看到一篇”裝潢”部落格的教學文章：CSS Dock Menu。這篇文章提供一個Hack，讓您可以在您的部落格中安裝一個有 Mac 風格的 Dock Menu （如以下三張圖所示）。

blog css dock 1

blog css dock 2

blog css dock 3

原作者（Nick La）於文中說明這個 CSS Dock Menu 是使用 Jquery Javascript library 與 Fisheye component from Interface 以及一些作者自製的 icons 製作而成的。同時，這個 CSS 已經過作者測試：相容於大部分常見的瀏覽器（IE 6, IE 7, Opera 9, Firefox 2, and Safari 2）。

小弟試玩了一下，真是好玩、新奇又有趣，但是，小弟對於網頁設計與美工實在是沒什麼概念，裝好之後不知道該放哪比較好，咩… 所以，最後還是忍痛把它拆了。呵呵^^

【延伸閱讀】有興趣的朋友可以到友站（就是Noob）中閱讀相關文章：（我開始討厭 IE），並且觀看實際成品喔！^^

 

本文作者：Allen Yang

因為對美好事物的著迷，所以我拿起相機，透過觀景窗，欣賞並紀錄眼前的美麗景象！因為對永恆生命的渴望，所以我撰寫部落格，透過網路，讓我的思緒、我的故事恆久不滅！

  • Steve

    這個真的滿好玩的,
    只要有ㄧ點點觀念就可以換上自己喜歡的icon
    不過如果icon用.png圖檔的話在ie6上還是會看到白底,很討厭..

  • Chentunglee

    看起來好有趣的DOCK哦~
    我也是沒什麼美工天分，不過還是玩看看先XD
    ㄏㄏ~

  • Allen Yang

    to Steve

    哈囉！很高興您能來拜訪我的部落格，其實這篇文章的CSS Dock Menu是從您的文章中導引道原作者那邊的。^^ 我有將您的文章重新加入道我的部落格中當作延伸閱讀囉！^^

    對啊～ 有關這個css在ie上的效果，我後來也發現了這個現象，不過我早就對M$ IE失望透了～ 呵呵

    to Chentunglee

    哈囉！好久不見哩^^ 這個真的不錯玩說^^

  • Steve

    你太客氣了啦~
    我也是看了別人的文章才用的.

    我是CSS和html語法的新手
    dock menu裝的上去是用時間亂摸出來的><

    如果大家有興趣可以ㄧ起來討論^^..

  • cyber runner

    我也是從steve那邊連到這的
    謝謝兩位分享
    我也一直再找有沒有比較好看的navigtro bar的設計
    不過這個要重新調icon大小
    我會試試看的

  • Allen Yang

    To cyber runner
    感謝您的來訪！很喜歡你的部落格的頁面設計耶～給人一種很乾淨清爽的感覺 ^^
    小弟最近開始學習css與javascript，將來或許能一起分享討論相關的知識 ^^