向下滑動，向上滑動格上單擊

我使用下面的代碼使用JS來打開和關閉一個div（幻燈片上/下）向下滑動，向上滑動格上單擊

我有向下連接到一個按鈕事件幻燈片和上滑事件用於關閉文本。

我想要的是按鈕onclick打開並onclick再次關閉幻燈片元素。

這裏是JS

// slide down effect 

$(function(){ 
$('.grabPromo').click(function(){ 
var parent = $(this).parents('.promo'); 
$(parent).find('.slideDown').slideDown(); 
}); 
$('.closeSlide').click(function(){ 
var parent = $(this).parents('.promo'); 
$(parent).find('.slideDown').slideUp(); 
}); 
});

的HTML：

<span class="grabPromo">Open</span>

，並在向下滑動區域，我有

<a class="closeSlide">Close</a>

讚賞任何幫助。

理想情況下，我需要向下滑動按鈕上的向下箭頭和向上箭頭以替換它以在同一按鈕上滑動。並且完全消除關閉鏈接。

任何幫助表示讚賞。乾杯

來源

2011-03-12 422

嘗試。它允許多個項目，因此不是ID特定的。並支持通過AJAX加載的任何內容。 jsfiddle is here

<div class='toggle_parent'> 
    <div class='toggleHolder'> 
    <span class='toggler'>Open</span> 
    <span class-'toggler' style='display:none;'>Close</span> 
    </div> 
    <div class='toggled_content' style='display:none;'> 
     My Content 
    </div> 
</div>

和

$('.toggler').live('click',function(){ 
    $(this).parent().children().toggle(); //swaps the display:none between the two spans 
    $(this).parent().parent().find('.toggled_content').slideToggle(); //swap the display of the main content with slide action 

});

來源

2011-03-12 00:20:59 FatherStorm

完美！正是我之後，投票表示感謝 – 422 2011-03-12 01:03:54

<div id="content"> 
bla bla bla bla bla bla bla bla blabla bla blabla bla bla 
</div> 
<input type="button" id="myButton" value="Slide down ↓"/> 

$("#myButton").toggle(function(){ 
    $("#content").slideDown(); 
    $(this).val("Slide up ↑"); 
},function(){ 
    $("#content").slideUp(); 
    $(this).val("Slide down ↓") 
});

在線演示：http://jsfiddle.net/amosrivera/AYWku/

演示與span：http://jsfiddle.net/amosrivera/AYWku/1/

來源

2011-03-12 00:12:30 amosrivera

這將是很好，但我不想使用輸入按鈕。我們正在使用抓緊這個特價 – 422 2011-03-12 00:15:26

@amosrivera，哈哈漂亮的箭頭符號。 – 2011-03-12 00:16:00

@ 422，點擊元素是什麼都沒有關係，他給你的功能，你可以改變輸入到跨度，如果你想，它只需要有相同的ID .... – 2011-03-12 00:16:58

你可以只使用slideToggle()在點擊功能：

$('.grabPromo').click(function(e){ 
    $('.slideDown').slideToggle(); 
});

Here's a demo.

來源

2011-03-12 00:24:08 mVChr

向下滑動，向上滑動格上單擊

回答

相關問題