Filter & sort magical layouts http://isotope.metafizzy.co
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

2.1 KiB

title category layout related
Methods docs doc methods

Isotope offers several methods to extend functionality. Isotope's methods follow the jQuery UI pattern.

{% highlight javascript %}

$('#container').isotope( 'methodName', [optionalParameters] )

{% endhighlight %}

addItems

{% highlight javascript %}

.isotope( 'addItems', $content, callback )

{% endhighlight %}

Adds elements to the pool of item elements of the container, but does sort, filter or layout. More details in Adding items.

appended

{% highlight javascript %}

.isotope( 'appended', $content, callback )

{% endhighlight %}

Adds elements via addItems method, then triggers layout just for those new elements. Useful for Infinite Scroll. More details in Adding items.

See Demo: Adding items.

destroy

{% highlight javascript %}

.isotope( 'destroy' )

{% endhighlight %}

Removes Isotope functionality completely. Returns element back to pre-init state.

insert

{% highlight javascript %}

.isotope( 'insert', $content, callback )

{% endhighlight %}

Appends elements to container, adds items to via addItems method, and then triggers reLayout method so new elements are properly filtered, sorted and laid-out. More details in Adding items.

See Demo: Adding items.

layout

{% highlight javascript %}

.isotope( 'layout', $content, callback )

{% endhighlight %}

Positions specified elements in layout.

layout will only position specified elements, and those elements will be positioned at the end of layout. Whereas reLayout will position all elements in the Isotope widget.

option

{% highlight javascript %}

.isotope( 'option', options )

{% endhighlight %}

Modifies options for plugin instance.

reLayout

{% highlight javascript %}

.isotope( 'reLayout', callback )

{% endhighlight %}

Resets layout properties and lays-out every item element.

See Demo: reLayout

resize

{% highlight javascript %}

.isotope( 'resize' )

{% endhighlight %}

Triggers layout-specific resize method.