Nach unten schieben und schieben bis div auf Klick

Ich bin mit dem folgenden code zum öffnen und schließen eines div ( slide up/down ) mit js

Ich habe den Schieber nach unten Ereignis angebracht, um eine Taste, und das slide-up event sttached zu schließen text.

Was ich will, ist der button onclick öffnen und onclick wieder die Folie schließen element.

Hier ist die 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>

und in der rutschen-Bereich habe ich

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

Jede Hilfe dankbar.

Idealerweise möchte ich einen nach unten gerichteten Pfeil auf der Folie unten-Taste und up-Pfeil, um es zu ersetzen, schieben Sie auf dieselbe Taste. Und tun, Weg mit der engen Verbindung zusammen.

Jede Hilfe dankbar. Cheers

InformationsquelleAutor 422 | 2011-03-12

  1. 10

    versuchen. es können mehrere posten, so ist nicht ID-spezifisch. und unterstützt beliebige Inhalte per AJAX geladen als auch. jsfiddle ist hier

    <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>

    und 

    $('.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

});
    Perfekt ! Genau das, was ich war nach , zum Dank

    InformationsquelleAutor FatherStorm

  2. 12

    Können Sie einfach slideToggle() in der click-Funktion:

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

    Hier ist eine demo.

    InformationsquelleAutor mVChr

  3. 6
    <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 ↓")
});

    Online-demo: http://jsfiddle.net/amosrivera/AYWku/

    Demo mit span: http://jsfiddle.net/amosrivera/AYWku/1/

    Wäre dies in Ordnung sein , aber ich dont wollen, verwenden Sie die input-Tasten. Wir sind mit <span class="grabPromo">Schnappen Sie sich Dieses Angebot</span>
    haha nice Pfeil-symbol.
    es spielt keine Rolle, was Sie auf element, er gab Ihnen die Funktionalität, die Sie ändern können, die Eingabe einer Zeitspanne, wenn Sie wollen, es muss nur die gleiche id....
    hehe danke, ich mag diese, Sie sind einfach und funktionieren. @422, wie nick sagte, die Funktionalität ist nicht angewiesen auf den element-Typ, aber ich habe einen link Breite der Spanne, so dass Sie sehen den kleinen Unterschied.
    Thats cool, aber wir haben andere Schieberegler auf der Seite. Was wäre also die Günstigste (code) Möglichkeit, das hinzufügen dieser Effekt auf andere div-Tasten , wie Sie mit ID, ich möchte nicht alle Tasten ser zur gleichen Zeit lol.

    InformationsquelleAutor amosrivera

Schreibe einen Kommentar