Постоянно обновлять элемент при прокрутке с помощью jQuery

#jquery #html #css

#jquery #HTML #css

Вопрос:

У меня есть HTML-элемент h2, который отображает положение div, когда пользователь прокручивает страницу вниз. Я хочу, чтобы этот элемент h2 обновлял положение div после начальной прокрутки, чтобы при продолжении прокрутки вниз число, отображающее координату y элемента, уменьшалось. Вот jsFiddle: http://jsfiddle.net/adnLX /

Скрипт, который я использую для отображения позиции:

  $(document).ready(function(){

 $(window).scroll(function(){
    var xx = $("#bottom").position().top;

     $("#title").html(xx);
 });
 });
  

Подводя итог, я хочу постоянно обновлять и отображать позицию div (она представлена символом «0» внизу первой страницы) по мере ее прокрутки вверх и вниз, но пока я могу отображать только начальную позицию при первой прокрутке. Как мне пересмотреть свой скрипт, чтобы постоянно отображать позицию?

Ответ №1:

Я думаю, вам нужно посмотреть scrollTop . Позиция #bottom не меняется, так что .top вызов никогда не изменится.

Но положение прокрутки изменится. Попробуйте что-то вроде этого

   $(window).scroll(function(){
    var xx = $("#bottom").position().top;
    var bottomPosition = $('body').scrollTop() - xx;
    $("#title").html(bottomPosition);
 });
  

Я попробовал это в вашей скрипке, и мне показалось, что это может быть правильно.