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

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和layout，但运气不佳。

Answer 1

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