如何實現這種jQuery效果？

Question

當我點擊 ASUS Products page's英特爾插座bla2 ..，頁面不必重新加載，點擊後例如Intel Socket 2011，英特爾C602 &英特爾X79出現了，我該如何使用jQuery實現它？

Answer 1

確實這很簡單。

首先，您可以在幾秒鐘內嘗試使用jQuery UI Tabs Widget。這不是相同的造型，但想法是一樣的。

這時你有兩種選擇：

• 您可以嘗試的風格了jQuery UI選項卡插件：jQuery UI的只是設置一些CSS類的DOM元素：如果重新定義這個類，你可以風格它你的方式

• 你可以重現沒有小部件的行爲。基本上，建立與小部件相同的標記，用CSS隱藏你的標籤，並點擊你的鏈接重新顯示它們。一個快速和骯髒的例子：

  $('ul#links li a').click(function(){ 
      $($(this).attr('href')).show().siblings().hide(); 
  }); 
  

編輯

也許更簡單的方式來設定樣式：http://os.alfajango.com/easytabs/