2010-04-17 2 views
0

У меня есть сайт с длинным списком твитов, и по мере прокрутки вниз по правой колонке следует вниз, показывая статистику по твитам. (См. Его в действии по адресу http://www.grapevinegame.com. Нажмите «запомнить», затем «пропустить», чтобы перейти на страницу списка. Работает в Safari и Chrome).Код jQuery, работающий в Safari и Chrome, но не в Firefox

Я использую jQuery для обновления верхнего края правого столбца, увеличивая его при прокрутке вниз. Кажется, он отлично работает в браузерах на основе webkit, но не работает в Firefox. Здесь код, правый элемент столбца - div с id = "distance".

// Listen for scroll function 
      $(window).scroll(function() { 

        // Calculating the position of the scrollbar 
        var doc = $("body"), 
        scrollPosition = $("body").scrollTop(), 
        pageSize = $("body").height(), 
        windowSize = $(window).height(), 
        fullScroll = (pageSize) - windowSize; 
        percentageScrolled = (scrollPosition/fullScroll); 

        var entries = $("#whispers-list > li").length; 

        // Set position of distance counter 
        $('div#distance').css('margin-top', ($("#whispers-list").height()+$("#latest-whisper").height()+33)*percentageScrolled); 

        // Update distance counter 
         $('#distance-travelled').text(Math.round(distanceTravelled*(1-percentageScrolled)));    
         $('#whispers-list li').each(function(index) { 

           //highlight adjacent whispers        
           if ($('#whispers-list li:nth-child('+(index+1)+')').offset().top >= $('#distance').offset().top && $('#whispers-list li:nth-child('+(index+1)+')').offset().top <= $('#distance').offset().top + $('#distance').height()) { 
            // alert("yup"); 
            $('#whispers-list li:nth-child('+(index+1)+') ul').fadeTo(1, 1); 
           } else { 
            $('#whispers-list li:nth-child('+(index+1)+') ul').fadeTo(1, 0.5); 
           } 
           });    

        }); 

Цените любую помощь или совет!

ответ

1

Обновлено!

Кажется, что $("body").scrollTop() всегда возвращается 0, который я предполагаю, является проблемой.

Но когда я пробовал $ («html»), scrollTop(), кажется, возвращает правильный scrollTop.

Попробуйте изменить scrollPosition линии к этому:

scrollPosition = $("html").scrollTop(), 
+0

спасибо, старались как там сейчас, но не похоже, чтобы какая-то разница –

+0

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

+0

Gotcha, хорошо после того, как я посмотрел на него еще немного, я думаю, проблема связана с использованием $ ("body"). scrollTop() ... попробуйте изменить на $ ("html"). scrollTop(), который, кажется, возвращает правильное значение для меня в FF. –

Смежные вопросы