6個出色的基于JQuery的Tab頁籤執行個體

NEW. KandyTabs 基于标準模式的萬能頁籤

有了這個頁籤插件，以下的6個基本可以另作考慮了。如果你隻需要簡單的應用，可以直接看第7個。毫不誇張！KandyTabs頁籤以HTML标準及使用者體驗為指導思想，順便美其名曰有利于SEO，在保留了網頁應有的格式與外觀的情況下，有效的将内容頁籤化。它不僅能讓網頁布局更緊湊，在失去它的作用時，網頁的本色同樣精彩！強大的預置功能，可以實作大部分你想要的效果，在最新版中，你還可以将其應用為slide幻燈片或according頁籤。到底有多好玩，現在就去看看吧！

1. jQuery 頁籤界面 / 頁籤結構菜單教程

這種類型的菜單在網頁設計與開發中非常著名的。此片教程是向大家展示如何使用jQuery的向下滑動/向上滑動效果建立屬于你自己的頁籤菜單。要非常留心此示範喲，你一定會喜歡上它的。

2. jQuery目錄導航插件

這個jQuery插件為我們提供了添加基于字母順序的導航小部件到有序和無序清單的方法。一個在清單之上的簡易的(via CSS)導覽列，向使用者展示從A到Z的檢索。通過從清單中選擇一個字母來顯示以此字母開頭的所有元素。在可選字母上面顯示的計數，是表明當你點選此字母的時候會有多少項目被現實。除此之外還有其他的基本功能可供選擇。

3. jQuery的Kwicks菜單

Kwicks起源于Mootools中的一個效果(相同名字),逐漸演變成一個高度可定制的通用部件.

4. jQuery褪色菜單 -更換内容

CSS-tricks上很好的教程，講解如何使用css和jQuery, 這次是他們教導如何使用 jquery使得菜單選項褪色。

5. jQuery idTabs

idTabs是jQuery的插件。他能非常容易的為網站添加頁籤. 但是他也為無窮的可能性敞開大門。

6. jQuery + CSS建立順暢的選顯示卡内容區

網頁設計師設法把大量的資訊濃縮在一個網頁上而不失可用性是最大的挑戰之一。内容頁籤化是處理此類問題非常棒的方法，最近廣泛被應用于部落格。這是一篇非常棒的教程講解，使用HTML建立一個小的頁籤資訊盒，最後使用一些簡單js功能與jQuery庫實作。

<a href="http://nettuts.s3.amazonaws.com/001_Tabbed/site/jQuery.html" target="_blank">示範</a>

7. jQuery1.4 輕松搞定Tab頁籤

這個跟我目前部落格用到的TAB頁籤原理差不多，隻不過是基于最新版jQuery的，代碼更簡潔了，幾乎必要的一行就能搞定，當然這是提供了一個思路，對初學者應該是有很大幫助的。

<a href="http://www.jgpy.cn/blog/front-end/easily_tab_with_jquery_14.htm" target="_blank">教程+示範</a>