Question

我正在尝试将新项目插入同位素的特定位置。基本上，当点击同位素项时，我想在下一行的开头添加一个完整的容器宽度项。它甚至可以是已存在且隐藏的项目。

以下是我正在研究的小提琴：http://jsfiddle.net/AAnrX/62/。

$(function(){  
  var $container = $('.isotope'); 
  var $checkboxes = $('#filters input');

  // init isotope, then insert all items from hidden #alpha
  $container.isotope({
    itemSelector: '.item' 
  }).isotope();


  $checkboxes.change(function(){
    var filters = [];
    // get checked checkboxes values
    $checkboxes.filter(':checked').each(function(){
      filters.push( this.value );
    });
    filters = filters.join(', ');
    $container.isotope({ filter: filters });
  });

  $('#shuffle').click(function(){
    $container.isotope('shuffle');
  });

    var $cell = $('.item');

    $cell.click(function () {       
        $('#box').insertAfter('#first');
        $container.isotope('reLayout');
    });    
});

基本上我所拥有的将改变DOM中项目的位置，但这并不影响我猜测同位素的位置。我在更改之后尝试了reLayout和布局，但我没有太多运气。

Answer 1

显然代替$container.isotope('reLayout')我需要使用$('.isotope').isotope('reloadItems').isotope({ sortBy: 'original-order' });重新加载后，项目会按同位素顺序正确重新定位。

同位素插入元素到特定位置

1 个答案: