Przycisk powrotu do góry w jQuery

25 listopada 2015
1 gwiadka2 gwiazdki3 gwiazdki4 gwiazdki5 gwiazdek

Za pomocą metod jQuery animate i scrollTop można łatwo utworzyć przycisk powrotu na górę strony z animacją i nie trzeba do tego celu wykorzystywać żadnych wtyczek.

Kod jQuery:

// powrót do góry
$('.top').click(function (e) {
  e.preventDefault();
  $('html, body').animate({scrollTop: 0}, 800);
});

Kod HTML

<!-- dowolnemu elementowi, np. kotwicy, należy przypisać klasę top -->
<a class="top" href="#">Powrót na górę</a>

Wartość własności scrollTop określa miejsce, do którego ma zostać przewinięta strona. Działanie tego prostego skryptu polega na animowaniu przewijania elementu body przez 800 milisekund w celu przejścia na górę strony.

Autor: Matt Smith

Źródło: https://github.com/AllThingsSmitty/jquery-tips-everyone-should-know

Tłumaczenie: Łukasz Piwko

Treść tej strony dostępna jest na zasadach licencji MIT

Dyskusja

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *