jQuery Прокрутите страницу вниз / страницу

Как я могу использовать jquery для прокрутки вправо до нижней части iframe или страницы?

Если вам нужна хорошая медленная прокрутка анимации, для любого якоря с href="#bottom"этим прокрутите вас вниз:

$("a[href='#bottom']").click(function() {
  $("html, body").animate({ scrollTop: $(document).height() }, "slow");
  return false;
});

Не стесняйтесь менять селектор.

scrollTop () возвращает количество пикселей, которые скрыты от просмотра в прокручиваемой области, поэтому задайте его:

$(document).height()

будет фактически выходить за пределы нижней части страницы. Чтобы прокрутить на самом деле «стоп» внизу страницы, нужно вычесть текущую высоту окна браузера. Это позволит использовать смягчение при необходимости, поэтому оно становится:

$('html, body').animate({ 
   scrollTop: $(document).height()-$(window).height()}, 
   1400, 
   "easeOutQuint"
);

Например:

$('html, body').scrollTop($(document).height());

После того, как эта тема не сработала для меня из-за моей конкретной потребности (прокрутка внутри определенного элемента, в моем случае текстовая область), я обнаружил это в глубине души, которая может оказаться полезной для кого-то другого, читающего это обсуждение:

Альтернатива на планетном облаке

Поскольку у меня уже была кэшированная версия моего объекта jQuery ( myPanelв приведенном ниже коде это объект jQuery), код, который я добавил в свой обработчик событий, был просто так:

myPanel.scrollTop(myPanel[0].scrollHeight - myPanel.height());

(спасибо Бен)

Простая функция, которая переходит (мгновенно прокручивается) в конец всей страницы. Он использует встроенный .scrollTop(). Я не пытался адаптировать это для работы с отдельными элементами страницы.

function jumpToPageBottom() {
    $('html, body').scrollTop( $(document).height() - $(window).height() );
}

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

var elem = $('#box');
if (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight()) {
  // We're at the bottom.
}

Если вас не волнует анимация, вам не нужно получать высоту элемента. По крайней мере, во всех браузерах, которые я пробовал, если вы дадите scrollTopчисло, которое больше максимума, оно просто прокрутится вниз. Так что дайте ему как можно большее число:

$(myScrollingElement).scrollTop(Number.MAX_SAFE_INTEGER);

Если вы хотите прокрутить страницу, а не какой-либо элемент с полосой прокрутки, просто сделайте myScrollingElementравным body, html.

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

(function($) {
  $.fn.scrollToBottom = function() {
    return this.each(function (i, element) {
      $(element).scrollTop(Number.MAX_SAFE_INTEGER);
    });
  };
}(jQuery));

Так что я могу сделать это, когда я добавляю материал Buncho:

$(myScrollingElement).append(lotsOfHtml).scrollToBottom();

Сценарии, упомянутые в предыдущих ответах, такие как:

$("body, html").animate({
    scrollTop: $(document).height()
}, 400)

или

$(window).scrollTop($(document).height());

не будет работать в Chrome и будет нервным в Safari, если html тег в CSS имеет overflow: auto;набор свойств. У меня ушло почти час, чтобы понять.

$('.block').scrollTop($('.block')[0].scrollHeight);

Я использую этот код для прокрутки чата, когда приходят новые сообщения.