функция прокрутки вниз по клику

0

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

<div id="button"></div>
<div1 style="height:300px;">img1</div>
<div2 style="height:300px;">img2</div>
<div3 style="height:300px;">img3</div>
<div4 style="height:300px;">img4</div>

$(function() {
$("#button").on("click", function() {
    $("html, body"). animate({"scrollTop":$().offset().top-300}, 1000);
    return false;
    });
}); 
  • 0
    $() ничего не делает, это должно быть {scrollTop:$(this).offset().top - 300}
Теги:

3 ответа

1
Лучший ответ

$().offset().top ничего не делает. Замените его на window.scrollY

$(function() {
    $("#button").on("click", function() {
        $("body").animate({"scrollTop": window.scrollY-300}, 1000);
        return false;
    });
}); 

Кроме того, отрицательный результат вверх и положительный, когда мы говорим о прокрутке, поэтому вы, вероятно, захотите добавить 300 вместо этого.

  • 0
    работает как шарм! Спасибо! :)
3

Попробуйте использовать window.scrollBy(0,300);

  • 0
    это не оживляет
0

Я думаю, что это лучший способ.

var body = $('html, body');
$('#button').click(function() {
   var n = $(document).height() - $(window).height();
   body.stop().animate({scrollTop: n }, 1000, function() {
});
});
  • 0
    Почему это лучший способ?
  • 0
    Потому что он прокручивается вниз, используя фактическую высоту вашей страницы минус высота окна. Не только высота окна.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню