jquery - Jquery同位素不工作

Question

这是我面临的问题 - 它有时只发生： 这是我的输出图像：

我需要与 Pintrest 样式相同的输出。

代码：

$(document).ready(function(){
        var $container = $('#content');
$container.isotope({
    filter: '*',
    //layoutMode : '',
        animationOptions: {
     duration: 750,
     easing: 'linear',
     queue: false,

   }



});

$('#nav a').click(function(){
  var selector = $(this).attr('data-filter');
    $container.isotope({ 
    filter: selector,
    animationOptions: {
     duration: 750,
     easing: 'linear',
     queue: false,

   }
  });
  return false;
});

});

已解决：问题已解决:)

Answer 1

我已经在您的网站上进行了测试，这是您的答案：

$('#content').isotope({
  itemSelector:'.isotope-item',
  layoutMode: 'fitRows'
});

将 layoutMode 更改为此处可用的其他值：http: //isotope.metafizzy.co/docs/layout-modes.html

此外，您的标头 JS 应如下所示：

<script type="text/javascript">
$( document ).ready( function() { // Here you listen for the document ready event, when html, css, js are ready
  $( '#part1' ).load("home/" , function(){ $('#loading').remove();});
});
//hide frame on resizing the window
$(window).bind('resize load', function(){ // here you listen for resize and load of images, iframes and others
  if ($(window).width() < 1349) {
    $('#frame').hide();
    $('#right').css('width' , '85%');
  }
  else {
    $('#frame').show();
    $('#right').css('width' , '72%');
  }
});
</script>