jquery scrollTop не работает при автоматическом переполнении HTML и тела

Основная проблема в том, что scrollTop () не работает, когда стили html и body выглядят так:

html
  margin: 0
  padding: 0
  border: 0
  overflow: auto

body
  padding: 0
  margin: 0
  background-image: url('/imgs/bg1.jpg')
  overflow: auto
  background-repeat: no-repeat

Мой код js:

$('.get_method').click(function () {

  $('body').animate({
     scrollTop: $(".test").offset().top
  });

});

Когда я удаляю свойство переполнения из html или элементов тела (или везде), все работает отлично, но когда я прокручиваю документ, изображение BG заканчивается, и я получаю пробел. Все, что мне нужно, это фиксированное изображение BG и рабочий эффект анимации scrollTop, когда я нажимаю кнопку .get_method.

РЕДАКТИРОВАТЬ:

element .test его элемент div. CSS:

.test
  position: relative
  top: 900px

html jquery css overflow scrolltop
person Sergei Kobets    schedule 23.11.2016    source источник
comment
Если вы измените $('body') на $(window)?   -  person Vassilis Pits    schedule 23.11.2016
comment
снова не работает   -  person Sergei Kobets    schedule 23.11.2016

Ответы (1)


arrow_upward
0
arrow_downward

попробуй это

демонстрация

html

 <h1>Top of the page</h1>

<article style="height: 1000px">
    <p style="margin-bottom: 600px">Scroll down the page&hellip;</p>
    <p>Then click the box.</p>
    <a href="#" class="scrollup">Scroll</a>
</article>

jquery

$(document).ready(function () {

    $(window).scroll(function () {
        if ($(this).scrollTop() > 100) {
            $('.scrollup').fadeIn();
        } else {
            $('.scrollup').fadeOut();
        }
    });

    $('.scrollup').click(function () {
        $("html, body").animate({
            scrollTop: 0
        }, 600);
        return false;
    });

});
person Falguni Panchal    schedule 23.11.2016
comment
все работает хорошо но основная проблема в том, что я не могу понять как сделать FIXED BG. Мне нужно прокручивать содержимое с фиксированным bg ... Когда я скрываю переполнение html и прокручиваю переполнение тела, я получаю фиксированный BG, но ваш скрипт не работает - person Sergei Kobets; 23.11.2016
comment
Ключевым моментом является overflow: auto или overflow: visible. Я не могу найти решение. - person Eric; 26.07.2021