Ustawiłem stronę tak, aby przewijała się do góry po kliknięciu przycisku. Ale najpierw użyłem instrukcji if, aby sprawdzić, czy góra strony nie jest ustawiona na 0. Następnie, jeśli nie jest to 0, animuję stronę, aby przewijała się do góry.
var body = $("body");
var top = body.scrollTop() // Get position of the body
if(top!=0)
{
body.animate({scrollTop:0}, '500');
}
Najtrudniejszą częścią jest teraz animowanie czegoś PO przewinięciu strony na górę. Więc moją następną myślą jest, dowiedzieć się, jaka jest pozycja strony. Więc użyłem logu konsoli, aby się tego dowiedzieć.
console.log(top); // the result was 365
To dało mi wynik 365, I'm guessing that is the position number I was at just before scrolling to the top.
Moje pytanie brzmi: jak ustawić pozycję na 0, abym mógł dodać kolejną animację, która uruchomi się, gdy strona znajdzie się na 0?
Dzięki!
Aby to zrobić, możesz ustawić funkcję wywołania zwrotnego dla polecenia animate, która zostanie wykonana po zakończeniu animacji przewijania.
Na przykład:
var body = $("html, body");
body.stop().animate({scrollTop:0}, 500, 'swing', function() {
alert("Finished animating");
});
Tam, gdzie jest ten kod alertu, możesz wykonać więcej javascript, aby dodać dalszą animację.
Również 'swing' jest tam, aby ustawić easing. Sprawdź http://api.jquery.com/animate/, aby uzyskać więcej informacji.
Spróbuj tego zamiast tego:
var body = $("body, html");
var top = body.scrollTop() // Get position of the body
if(top!=0)
{
body.animate({scrollTop :0}, 500,function(){
//DO SOMETHING AFTER SCROLL ANIMATION COMPLETED
alert('Hello');
});
}
do tego celu można użyć metody callback
body.animate({
scrollTop:0
}, 500,
function(){} // callback method use this space how you like
);