Flexslider和砌體 - imagesLoaded問題

我想在一個砌體jQuery佈局中包含FlexSlider畫廊。但是，我無法通過砌體來識別FlexSlider的正確高度。我知道我顯然在使用imagesLoaded腳本時出了點問題。Flexslider和砌體 - imagesLoaded問題

我有imagesLoaded鏈接正確，並嘗試幾乎每個加載順序的組合。

我如何讓FlexSlider和砌體一起工作？提前致謝！

現在，我有以下腳本加載在我的文檔準備功能：

var $container = $('#masonry'); 

     $container.imagesLoaded(function() { 
      $container.masonry({ 
       itemSelector: '.item', 
       gutter: 25 
      }); 
     }); 

    $('.multiSlide').flexslider({ 
      slideshow : true, 
      animation : 'slide', 
      pauseOnHover: true, 
      animationSpeed : 400, 
      smoothHeight : true, 
      directionNav: true, 
      controlNav: false, 
      prevText : '<span class="fa fa-caret-left"></span>', 
      nextText : '<span class="fa fa-caret-right"></span>' 
    });

來源

2014-12-06 user1566957

可能一的jsfiddle – Dave 2014-12-06 03:41:24

我無法在jsfiddle中複製效果。這裏是我測試它的網站：http：//chadsherman.com/wp/ 問題發生在Safari - 但不是Chrome – user1566957 2014-12-06 04:25:32

不，我的意思是在Safari中我有一個重疊的問題。這裏有一個截圖：http://i.imgur.com/FYba6Ly.png 編輯...你刪除了你的評論:-( – user1566957 2014-12-06 04:44:29

這是不是一個漂亮的修復，但我（）工作圍繞同一問題通過使用setTimeout的第一個這樣Flexslider火災：

var $container = $('#masonry'); 

function loadMasonry(){ 
    $container.imagesLoaded(function() { 
     $container.masonry({ 
      itemSelector: '.item', 
      gutter: 25 
     }); 
    }); 
} 

setTimeout(loadMasonry, 500); 

$('.multiSlide').flexslider({ 
    slideshow : true, 
    animation : 'slide', 
    pauseOnHover: true, 
    animationSpeed : 400, 
    smoothHeight : true, 
    directionNav: true, 
    controlNav: false, 
    prevText : '<span class="fa fa-caret-left"></span>', 
    nextText : '<span class="fa fa-caret-right"></span>' 
});

我知道一定有這樣做一個更好的辦法，但似乎直到我找出更好的事情可能是這樣的伎倆：P

來源

2015-01-17 21:28:47 user4465745

Flexslider和砌體 - imagesLoaded問題

回答

相關問題