Mit jQuery das Scrollen der Seite animieren

24. Juli 2019

Mit jQuery das Scrollen der Seite animieren

Zum Anfang der Seite scrollen

This example shows, how to scroll to the top border of the page in 500 ms.

1
$('html,body').animate({scrollTop:0},500);

Mit einem Doppelklick kann der gesamte Code markiert werden.

Zu der Position eines Elementes scrollen

This example shows, how to scroll to the vertical position of a selected element in 500 ms.

1
$('html,body').animate({scrollTop:$(element).offset().top},500);

Mit einem Doppelklick kann der gesamte Code markiert werden.

Zum Ziel eine Anker-Links scrollen

This example shows, how to scroll to target of an anchor-link by clicking on the link in 500 ms.

1
2
3
4
5
$('a[href^=#]').on('click',function()
{
$('html,body').animate({scrollTop:$($(this).attr('href')).offset().top},500);
return false;
});

Mit einem Doppelklick kann der gesamte Code markiert werden.