JQuery Анимация Div Прокрутка вверх

У меня есть div, у которого есть контент:

<div id="First">There are lots of content in here. Blah Blah Blah...</div>

div имеет атрибут стиля overflow:auto;, поэтому, если какой-либо контент должен переполняться, появится полоса прокрутки. У меня есть кнопка внутри div в конце содержимого.

Поскольку содержимое внутри div может содержать глубокую прокрутку, все равно, что при нажатии кнопки он переместит прокрутку назад в верхнюю часть div?

Ответы

Ответ 1

Да. Используйте scrollTop

Просто укажите свой элемент и значение 0, как это:

$('#id').scrollTop(0);

Вы также можете анимировать прокрутку вверх, как показано ниже:

$('#id').animate({
   scrollTop: 0
}, 'slow');

Ответ 2

Для этого вам не нужен jQuery (или даже JavaScript).

DEMO

Определите имя привязки:

<a name="top"></a>

И создайте ссылку на этот якорь внизу:

<a href="#top">back to top</a>

Ответ 3

Используйте ScrollTop, если вы имеете дело с y-overflow и/или ScrollLeft для x-overflow.

$('#yourbuttonid').click(function() {
    $('#First').scrollTop(0);//for vertical scroll
    $('#First').scrollLeft(0);//for horizontal scroll
});

Ответ 4

$('#scrollToTopButton').click(function(){
    $('#First').scrollTop(0);
});

Ответ 5

OVERKILL!!! Использование scrollTop или jquery, если на то пошло... для такой простой задачи, возможно, нецелесообразно. Вместо этого используйте якоря:

<a name="pageTop"></a>
....
<a href="#pageTop">TOP</a>

Или есть что-то еще, что вы хотите сделать?