JQuery Прокрутка вниз страницы/iframe

Ответ 1

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

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

Невозможно изменить селектор.

Изменить: Пожалуйста, посмотрите на ответ ниже Том Бейтс для потенциально лучшего ответа.

Ответ 2

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

$(document).height()

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

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

Ответ 3

Например:

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

Ответ 4

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

Альтернатива на планете

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

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

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

Ответ 5

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

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

Ответ 6

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

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

Ответ 7

Если вам не нужна анимация, вам не нужно получать высоту элемента. По крайней мере во всех браузерах, которые я пробовал, если вы дадите 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();

Ответ 8

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

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

или

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

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