2013-05-02 3 views
0

Я пытаюсь работать с плагинами Packery и infinitescroll jquery, но по какой-то причине новые элементы появляются друг на друга.Packery + Infinitescroll + imagesLoaded = не работает

Я был направлен на плагин с изображениями, однако по какой-то причине он, похоже, накладывает элементы друг на друга. Я применил исправление для плагина Smart Scroll для jQuery 1.9 (https://github.com/lukeshumard/smartscroll/pull/2), однако, я считаю, что проблема связана с изображениями и упаковкой.

Мой сценарий выглядит следующим образом:

$(document).ready(function() { 

     // declaring variables 
     var $sidebar  = $("#sidebarHolder"), 
      $sidebarwidth = $sidebar.width(), 
      $window   = $(window), 
      $windowheight = $window.height(), 
      $offset   = $sidebar.offset(), 
      $topPadding  = $("#sitewide").height(), 
      $container  = $('#container.clearfix'); 

     // making sure the sidebar stays the right size when it's resized 
     $(window).on("resize",function() { 
      $("[role=sidebar]").width($sidebarwidth).show(); 
      $("#sidebarHolder,[role=sidebar]").height($windowheight + 20); 
     }).resize(); 

     // scroll 'stick to the top' function 
     $(window).on("scroll",function() { 
      if ($window.scrollTop() > $offset.top) { 
       $sidebar.addClass('sticky'); 
      }else{ 
       $sidebar.removeClass('sticky'); 
      } 
     }).scroll(); 

     $container.packery({ 
      itemSelector:'article.item', 
      columnWidth:"div.grid-sizer", 
      rowHeight:"div.grid-sizer", 
      gutter:"div.gutter-sizer", 
      transitionDuration:'0.2s' 
     }); 

     $container.infinitescroll({ 
      navSelector:'div.paginate', 
      nextSelector:'div.paginate a.next', 
      itemSelector:'article.item', 
      loading:{ 
       finishedMsg:'No more pages to load.' 
      } 
     }, 
     function(newElements) { 
      $(newElements).imagesLoaded(function(){ 
       $container.packery('appended', newElements); 
      }); 
     }); 

    }); 

Любая помощь будет оценена.

При необходимости я могу настроить jsbin или codepen.

ответ

0

Кажется, проблема с Chrome Canary, поскольку она работает в других браузерах ...

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