Animieren Sie die Deckkraft ein - / ausblenden

also, was ist der Unterschied zwischen:

A) (für mich arbeiten)

... .animate({opacity: "show", marginTop: "25"}); ...

...

B (nicht für mich)

... .animate({opacity: "1", marginTop: "25"}); ...

e.g http://jsbin.com/iquwuc/6/edit#preview

InformationsquelleAutor ogni | 2012-02-06
  1. 2

    Beim Aufruf hide() das ist in etwa äquivalent zu .css('display', 'none'), damit später ändern die Deckkraft wieder auf 1 ändert die Deckkraft ein hidden-element. Und das ist, warum show() funktioniert - denn es ist das element block wieder.

    • +1 für die Erklärung der Differenz von 'show' und 1 in diesem Zusammenhang. ref: zusätzlich zu den numerischen Werten jede Immobilie können die Zeichenfolgen 'show', 'hide', und 'toggle'. Diese Verknüpfungen ermöglichen benutzerdefinierte ausblenden und anzeigen von Animationen, die unter Berücksichtigung der Art der Darstellung des Elements.
    • Sehr hilfreich für mich, vielen Dank
    InformationsquelleAutor Zoltan Toth
  2. 2

    Es ist, weil man sich zeigen und verstecken, anstatt das animieren der Deckkraft. (Irgendwie offensichtlich 😛 ).

    Bearbeiteten code : http://jsbin.com/iquwuc/11/edit#preview

    Können Sie folgende änderungen verwenden Sie den Deckkraft-Einstellung:

    Fügen Sie den folgenden css:

    .sub-menu li#access ul {opacity:0; display:none;}

    Und ändern Sie Ihr Skript, um diese:

    $(document).ready(function(){

    $('.sub-menu').hover(function(){ 
          $('.sub-menu li#access ul').show();
        $('.sub-menu li#access ul').stop().animate({opacity: 1, marginTop: "25"}, 500);
        },
        function() {
                  $('.sub-menu li#access ul').stop().animate({opacity: 0, marginTop: "10"}, 500,function(){
                  $('.sub-menu li#access ul').hide();
                  });   
        });
});

    Im Grunde, was passiert ist:

    Auf schweben, Sie ZEIGEN ' Ing der dropdown-Liste mit Deckkraft 0, dann animation passiert, setzen Marge und Deckkraft. und auf hover-out, Animation der Deckkraft zu 0 und AUSBLENDEN ' Ing es wieder.

    InformationsquelleAutor Marc Uberstein
  3. 1

    in der css-Datei oder inline. Legen Sie die id oder Klasse zu

    inline - <div id="myid" style="opacity:0;"></div>

    in css 

            #myid { opacity: 0; }
        .myclass {opacity: 0; }

    diese Weise beim Aufruf des animieren Deckkraft von jQuery funktioniert es andere weisen, die Ihr nur dem Aufruf einer animation, die bereits bei 1 Deckkraft

    • Ich verstehe, vielen Dank
    InformationsquelleAutor Damien Keitel
  4. 0

    Ich würde dojo-bibliothek, die für Sie (http://dojotoolkit.org/reference-guide/dojo/animateProperty.html). Finden Sie in der DOJO-mehr als nur animieren, die Funktionalität, die dieses framework bietet eine Vielzahl von Komponenten zu lösen großen Gebiet verschiedene Probleme.

    InformationsquelleAutor Igor
Schreibe einen Kommentar