Как вернуться на начало странице с помощь JQuery

На сайтах, очень часто встречается стрелка, направленная вверх, кликнув по которой, мы возвращаемся на начало странице. Покажу простой код, состоящий из двух строк, как можно реализовать у себя данную функцию

Первое, что нам нужно будет сделать, это поставить что-то вроде якоря, например, это будет какой-нибудь див блок, который всегда у вас находится вверху странице. В нашем примере, это див с id=”top”

<div id="top">&nbsp;</div>

Далее реализуем клик, на который повесим функцию.Кликать будем по кнопке с id=”verh”, к примеру:

<button id="verh">Вверх</button>

<button id="verh">Вверх</button>

И сама функция:

//Возврат на начало странице
$('#verh').click(function(){
var target_top=$('.top').offset().top;
$('html').animate({scrollTop:target_top}, 500);
});

//Возврат на начало странице

$('#verh').click(function(){

var target_top=$('.top').offset().top;

$('html').animate({scrollTop:target_top}, 500);

});

Здесь 500 – это скорость подъема в мс, чем больше значение, тем медленнее прокрутка.

Можно обойтись и одной строчкой, отказавшись от переменной target_top, заменив ее на 0:

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

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