jquery滑塊與多個div

Question

我想創建一個網站，我在一個div（＃page2）中有多個圖像（鏈接），當點擊一個關閉已打開的div（＃page1）和打開與被點擊的圖像（鏈接）相關的內容。當點擊另一個圖像（鏈接）時，它應該關閉＃page1中的打開內容並打開相關內容。我確信這是可能的，但我不知道該怎麼做。

Answer 1

HTML：

<div class="links"> 
    <a href="#page1"><img src=""/></a> 
    <a href="#page2"><img src=""/></a> 
    <a href="#page3"><img src=""/></a> 
</div> 
<div class="pages"> 
    <div id="page1"></div> 
    <div id="page2"></div> 
    <div id="page3"></div> 
</div> 

jQuery代碼：

$(document).ready(function() { 
    $('div.pages div').hide(); 
    $('div.links a').click(function() { 
    $('div.pages div').slideUp(); 
    $($(this).attr('href')).slideDown(); 
    return false; 
    }); 
}); 

您可以.fadeOut()或.hide()更換.slideUp()。 .slideDown()可以替換爲.fadeIn()或.show()

Answer 2

也許您正在尋找的是TABS或ACCORDION？

http://jqueryui.com/demos/tabs/

http://jqueryui.com/demos/accordion/