製作 Sliding Tabs 滑動頁籤功能

網站運用技巧

第四篇
製作 Sliding Tabs 滑動頁籤功能

壹、報導前言：
slide 是指幻燈片，sliding 可翻譯為滑動，此處是指切換或移動頁面內容時，產生類似滑動的效果。
Window Tabs，可翻譯為工作視窗分頁標籤，也就是在同一頁(檔名)下，產生類似被分頁過的翻頁效果。
近年來得益於 Mootools 開發一些專業的高質量應用程式介面(API)，大大地提升網站多樣化的特殊效果。
學習 Mootools 插件套用，除了必須具備 JavaScript 程式語言基礎外，你還是要懂得 HTML、CSS 等知識。
特別藉這個展示範例機會，發表一篇慶祝本報成立十周年，特別為會員們成立專屬會員下載網站之事 Go 。
本報導希望藉此帶領對此有興趣網友，認識及運用 Mootools 的相關應用程式介面(API)，提升網站水準。
聲明：本報導引用部份技術或觀念，係取自網路分享資源，其版權與著作權均為當事者所有，特此感謝與聲明。

貳、認識 MooTools：
我幫大家蒐集幾個不錯的 MooTools 教學與相關網站，值得初學者參考看看。

前往瞭解： GO

參、HTML 架構：
這是所有網頁都要有的基本架構，此處的標準驗證 DOCTYPE 宣告，必需使用 html 4.01 Strict DTD。
xml:lang 使用 "zh-TW"、lang 使用 "zh-TW"，其他照一般規定即可。

詳細內容介紹： GO

肆、CSS 樣式表單：
定義選項內的樣式、內寬度、內部連結等功能。

詳細內容介紹： GO

伍、MooTools 插件程式：
這裡用到 mootools.v1.11.js 及 sliding-tabs.js，這兩個 JavasCript MooTools 插件程式。

詳細內容介紹： GO

陸、模組範例：
套用上述幾個製作要領，完成四款不同完整模組範例給你參考與套用。

套用上述製作要領完成實際範例： GO
四款不同 Sliding Tabs 模組範例： GO

柒、相關展示：
這是我再網路上蒐集到有關 Sliding Tabs 相關範例網站，特別一併介紹給大家參考。

Sliding Tabs 相關範例展示： GO

捌、如何取得：

玖、結論與建議：