2013-03-08 73 views
0

問題摘要:而不是做什麼的代碼目前通常不會的 - 揭示內容的按鈕下 - 我需要它來揭示上述內容它獲取slideToggle()直接顯示上面的內容,而不是下面的內容?


首先,我不是在jQuery的/ JavaScript的精通任何意義,所以如果我要求太高,以我的名義可以做到,那麼請說出來和對溶液暗示。現在

,到問題:

$('.drop_down_title').click(function() { 
    $(this).next('.toggle_panel').slideToggle('slow', function() { }); 
    $(this).find('.arrow_drop_down').toggleClass('selected', function() { }); 
}); 

上面的代碼工作太棒了,出現如下標題的內容(如具有多種「相關」中,你可以隱藏側邊欄/顯示模塊)。

不過我也計劃使用相同的機械隱藏的內容部分,將是上面的按鈕,像這樣:

http://i.stack.imgur.com/B91DC.png

凡按鈕將被點擊透露更多的總結或要點。

我試着調整代碼的東西,像看上去合乎邏輯:

$(this).previous('.toggle_panel') 

在它查找的頁面爲相關類的希望,但仍然沒有骰子。

謝謝你的時間;任何意見,幫助或解決方案將不勝感激。

請求的HTML(當前工作幻燈片):

<html> 

<div class="slidebox"> 

    <div class="drop_down_title"> 
     <a class="arrow_drop_down">Button Click</a> 
    </div> 

    <div class="toggle_panel"> 
     <p>This is some example content that should be hidden when the above button is clicked!</p> 
    </div> 

</div> 
</html> 

我想要得到它,這樣的div 「drop_down_title」 和 「toggle_panel」 進行交換。這樣內容就會顯示在按鈕上方。

+0

可以顯示一些html嗎? – Tetaxa 2013-03-08 15:05:23

+0

如果您根據元素的底部絕對定位元素,則slideToggle將爲元素高度設置動畫效果,因此它將從上向下製作動畫,而不是從下向上製作動畫。雖然,我懷疑這確實是你需要做的。我們需要看到一些html/css – 2013-03-08 15:06:45

+0

@Tetaxa添加了HTML,我希望有幫助! – InsomniaBass 2013-03-08 15:10:51

回答

1

也許.prev()是你實際需要的。不是。以前。請參閱JQuery Docs

+0

試圖簡單地把prev代替之前沒有工作的地方。說實話,我認爲這可能只是因爲我對JavaScript和jQuery缺乏理解。我無法想象應該聽到它揭示按鈕上方的內容,而不是下面的內容。 我會在閱讀他們的基礎知識的同時,感謝您的建議和鏈接。 – InsomniaBass 2013-03-08 15:25:29

+0

爲什麼不能將.toggle_panel放在.drop_down_title上面並使用.prev()?如果你真的需要移動div,那麼你可以使用'$(this).next()。insertBefore($(this))。slideToggle('slow',function(){});' – 2013-03-08 15:32:07

+1

Aha!我看到你剛剛發表評論,因爲我正在寫這個,並且還有問題!這是我的理解/知識是問題,我閱讀了文檔,並意識到它不是用來瞄準選擇器,而是以前的兄弟姐妹(你說得對,對我來說是完美的!)。所以我所要做的就是刪除選擇器(讓我用prev())和et瞧,它的工作!非常感謝你! – InsomniaBass 2013-03-08 15:34:07

相關問題