Events

Isotope is an Event Emitter. You can bind listeners to events with the on and off methods.

var $container = $('#container').isotope({...});
var iso = new Isotope( elem );

function onLayout() {
  console.log('layout done');
}
// bind event listener
$container.isotope( 'on', 'layoutComplete', onLayout );
// un-bind event listener
$container.isotope( 'off', 'layoutComplete', onLayout );
// bind event listener to be triggered just once
$container.isotope( 'once', 'layoutComplete', function() {
  console.log('layout done, just this one time');
});

layoutComplete

$container.masonry( 'on', 'layoutComplete', function( isoInstance, laidOutItems ) {} )
// or with vanilla JS
iso.on( 'layoutComplete', function( isoInstance, laidOutItems ) {} )
// or with jQuery

• isoInstance

  Type: Isotope

  the Isotope instance

• laidOutItems

  Type: Array of Isotope.Items

  items that were laid out

Triggered after a layout and all positioning transitions have been completed.

$container.isotope( 'on', 'layoutComplete',
  function( isoInstance, laidOutItems ) {
    console.log( 'Isotope layout completed on ' +
      laidOutItems.length + ' items' );
  }
);

removeComplete

iso.on( 'removeComplete', function( isoInstance, removedItems ) { //...
// or with jQuery
$container.masonry( 'on', 'removeComplete', function( isoInstance, removedItems ) {} )

Triggered after an item element has been removed.

• isoInstance

  Type: Isotope

  the Isotope instance

• removedItems

  Type: Array of Isotope.Items

  items that were removed

$container.isotope( 'on', 'removeComplete',
  function( isoInstance, removedItems ) {
    notify( 'Removed ' + removedItems.length + ' items' );
  }
);