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 );
// return true to trigger an event listener just once
$container.isotope( 'on', 'layoutComplete', function() {
console.log('layout done, just this one time');
return true;
});
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' );
}
);
Resize browser or click item to toggle size
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' );
}
);
Click items to remove them