isotope/_posts/docs/2010-12-04-methods.mdown

---

title: Methods
category: docs
layout: doc
related: 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](adding-items.html).


## 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](adding-items.html).

[**See Demo: Adding items**](../demos/adding-items.html).

## 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](adding-items.html).

[**See Demo: Adding items**](../demos/adding-items.html).

## 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**](../demos/relayout.html)

## resize

{% highlight javascript %}

.isotope( 'resize' )

{% endhighlight %}

Triggers layout-specific resize method.