Wie restart/reset Jquery-animation

Wie kann ich zurücksetzen, eine animation mit jquery ? Zum Beispiel:

CSS

.block {
    position:absolute;
    top: 0;
    left: 0;
}

JS:

$('.block').animate({
    left: 50,
    top: 50
});

Wenn ich das Tue :

$('.block').stop();

wird die animation zu stoppen. Aber wie kann ich klar die position, um zu starten ? vom Punkt 0,0.

Schnelle Idee: einfach die CSS der elem direkt nach dem aufhören

InformationsquelleAutor Fede | 2014-08-20

  1. 12

    Wenn jQuery animieren ein element, fügt es das style-bezogene Informationen im style Attribut. Wenn Sie zurücksetzen müssen Sie das element, um es auf die Basis-Stil-ohne die jQuery-css, entfernen Sie einfach dieses Attribut am Ende der animation - Siehe .animieren () - jQuery API.

    $('.block').animate({
    left: 50,
    top: 50
}, 'slow', function () { $(this).removeAttr('style'); });

    Die callback-Funktion wird entfernen Sie die style Attribut und setzen Sie das element an das Ende der animation.

    InformationsquelleAutor Kami

  2. 1

    du suchst jquery .finish

    http://api.jquery.com/finish/

    $('.block').finish().css('top', '0').css('left', '0');
    hat das zurücksetzen der ursprünglichen position des Elements?

    InformationsquelleAutor JF it

  3. 1

    Können Sie .stop() wie Sie tun, aber ein argument hinzufügen, um es auch aus der Warteschlange löschen und dann zurücksetzen Ihres oberen und linken Positionen mit .css():

    $('.block').stop(true).css({top: 0, left: 0});

    .finish() ist auch in dieser gleichen Kategorie, aber das stellt alle Animationen, die auf Ihrem endgültigen Zustand, das ist nicht etwas, was Sie wollen, hier zu tun. Sie wollen einfach nur zu stoppen/löschen der aktuellen Animationen (einschließlich aller in der Warteschlange), und setzen Sie dann die CSS-Eigenschaften zurück zu Ihrem Ausgangszustand.

    InformationsquelleAutor jfriend00

  4. 0

    zurücksetzen animation 

    $('.block').removeAttr('style'); //
$('.block').animate({
    left: 50,
    top: 50
});

    InformationsquelleAutor ayed abboushi

Schreibe einen Kommentar