Страница продолжает прокручиваться вверх на несколько дюймов, когда я пытаюсь оставаться внизу страницы - PullRequest
Новая
       36

Страница продолжает прокручиваться вверх на несколько дюймов, когда я пытаюсь оставаться внизу страницы

1 голос
/ 27 октября 2019

У меня есть анимация jQuery, в которой ширина элементов изменяется от 0% до 100%, когда пользователь прокручивает его, создавая эффект слайда. Я дал им название класса «slideInBlock»

Однако [на мобильных Chrome и Firefox] я не могу заставить страницу оставаться в самом низу, где находится нижний колонтитул. Он продолжает прокручиваться до div перед нижним колонтитулом.
Я пытался удалить различные элементы в div контакта, например форму, или удалить весь div контакта полностью, чтобы предыдущий раздел был последним div на странице, но ничегосделал разницу.

Но когда я удаляю этот код jQuery slideInBlock, внезапно страница работает нормально. Как мне исправить код jquery, потому что это кажется виновником.

HTML: 

<div class="sections" id="contact">
<h1 class="slideInBlock">LET'S WORK<br>TOGETHER!</h1><br>

<div>
<h5>For bookings, business questions, and other inquiries, contact me via email or fill out the form below! :)
</div>
  <h5><strong> Contact:</strong><br>hello@bluseramusica.com <br><br>

</div>



<div id="footer">
<p>By Blusera, 2019. All Rights Reserved</p>
</div>

CSS: 

.sections{
  text-align:center;
  padding: 7% 8% 15%;
  margin: 0px auto;
 }
.slideInBlock{
  width:0%;
 }

jQuery: 

$(window).scroll(
 function(){

 $('.slideInBlock').each( function(i){

        var bottom_of_object = $(this).position().top + $(this).outerHeight();
        var bottom_of_window = $(window).scrollTop() + $(window).height();

        //Adjust the "200" to either have a delay or content starts fading before you reach it 
        bottom_of_window = bottom_of_window + 250;  

        if( bottom_of_window > bottom_of_object ){

            $(this).animate({'width':'100%'},800);



        }
    }); 

});
...