Прокрутите назад до вершины div

Ответ 1

var myDiv = document.getElementById('containerDiv');
myDiv.innerHTML = variableLongText;
myDiv.scrollTop = 0;

Смотрите атрибут scrollTop.

Ответ 2

Другой способ сделать это с гладкой анимацией - вот что

$("#containerDiv").animate({ scrollTop: 0 }, "fast");

Ответ 3

Я попробовал существующие ответы на этот вопрос, и никто из них не работал на Chrome для меня. Что работа была немного иной:

$('body, html, #containerDiv').scrollTop(0);

Ответ 4

scrollTo

window.scrollTo(0, 0);

- это окончательное решение для прокрутки окон вверх - лучшая часть состоит в том, что для нее не требуется никакого селектора идентификаторов, и даже если мы будем использовать структуру IFRAME, она будет работать очень хорошо.

Метод scrollTo() прокручивает документ до указанных координат.
window.scrollTo(xpos, ypos);
Требуется номер xpos. Координата для прокрутки по оси х (по горизонтали) в пикселях
ypos Требуется номер. Координата для прокрутки по оси Y (по вертикали) в пикселях

JQuery

Другая возможность сделать то же самое - использовать jQuery, и это даст более плавный вид того же

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

где 0 после scrollTop указывает вертикальную позицию полосы прокрутки в пикселе, а второй параметр - необязательный параметр, который показывает время в микросекундах для выполнения задачи.

Ответ 5

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

Exemple:

$('#elem').show();
$('#elem').scrollTop(0);

Ответ 6

Это сработало для меня:

document.getElementById('yourDivID').scrollIntoView();

Ответ 7

Для меня scrollTop путь не сработал, но я нашел другое:

element.style.display = 'none';
setTimeout(function() { element.style.display = 'block' }, 100);

Не проверял минимальное время для надежного рендеринга css, но 100 мс может быть переполненным.

Ответ 8

Если содержимое html переполняет один видовой экран, это сработало для меня, используя только javascript:

document.getElementsByTagName('body')[0].scrollTop = 0;

Привет,

Ответ 9

Если вы хотите прокрутить с плавным переходом, вы можете использовать это!

(Ваниль JS)

const tabScroll = document.getElementById("tabScroll");
window.scrollTo({
  'behavior': 'smooth',
  'left': 0,
  'top': tabScroll.offsetTop - 80
});

Если ваши целевые пользователи - Chrome и Firefox, то это хорошо! Но, к сожалению, этот метод не поддерживается достаточно хорошо во всех браузерах. Проверьте здесь

Надеюсь это поможет!!

Ответ 10

Согласно ответу Франсуа Ноэля: "Для тех, кто все еще не может выполнить эту работу, убедитесь, что переполненный элемент отображается перед использованием функции jQuery".

Я работал в модале начальной загрузки, который я неоднократно поднимаю с разрешениями учетной записи в div, который переполняет измерение y. Моя проблема заключалась в том, что я пытался использовать функцию jquery.scrollTop(0), и она не работала независимо от того, как я пытался это сделать. Мне нужно было настроить событие для модала, который не сбрасывал полосу прокрутки, пока модал не перестал анимироваться. Код, который наконец-то сработал для меня, находится здесь:

    $('#add-modal').on('shown.bs.modal', function (e) {
        $('div.border').scrollTop(0);
    });

Ответ 11

эти два кода помогли мне, как талисман, который первый будет использовать для прокрутки до верхней части страницы, но если вы хотите перейти к какому-то определенному div, используйте второй с вашим id id.

$('body, html, #containerDiv').scrollTop(0);
document.getElementById('yourDivID').scrollIntoView();

Если вы хотите прокрутить по имени класса, используйте код ниже

var $container = $("html,body");
var $scrollTo = $('.main-content');

$container.animate({scrollTop: $scrollTo.offset().top - $container.offset().top + $container.scrollTop(), scrollLeft: 0},300);

Ответ 12

Это единственный способ, которым я работал, с плавной прокруткой:

  $('html, body').animate({
    scrollTop: $('#containerDiv').offset().top,
  }, 250);

Ответ 13

При получении элемента по имени класса не забывайте, что возвращаемое значение является массивом; Отсюда этот код:

document.getElementByClassName("dropdown-menu").scrollTop = 0

Не будет работать. Вместо этого используйте код ниже.

document.getElementByClassName("dropdown-menu")[0].scrollTop = 0

Я полагал, что другие люди могут столкнуться с подобной проблемой, как и я; так что это должно сработать.