---
title: Options
category: docs
layout: doc
body_class: option-def
---
animationEngine
- String
'best-available'
Determines the jQuery method to apply styles, `.css()` or `.animate()`. Useful for relying on CSS transitions to handle animation.
#### Values
+ `'best-available'`: if browser supports CSS transitions, Isotope uses `.css()`. If not, falls back to using `.animate()`.
+ `'css'`: Isotope uses `.css()`
+ `'jquery'`: Isotope uses `.animate()`
animationOptions
- Object
{ queue: false }
When jQuery is the animation engine, these options will be used in .animate()
. See the [jQuery API for animate options](http://api.jquery.com/animate/#animate-properties-options) for details.
**Example:**
{% highlight javascript %}
$('#container').isotope({
animationOptions: {
duration: 750,
easing: 'linear',
queue: false
}
});
{% endhighlight %}
containerClass
- String
'isotope'
The class applied to the container element.
filter
- Selector
Setting a filter with show item elements that match the selector, and hide elements that do not match.
getSortData
- Object
An object containing one or several methods to retrieve data for Sorting. The methods receive one parameter (`$elem` in the example below) which is a jQuery object representing each item element. The methods need to return a value.
**Example**
{% highlight javascript %}
$('#container').isotope({
getSortData : {
symbol : function( $elem ) {
return $elem.attr('data-symbol');
},
number : function( $elem ) {
return parseInt( $elem.find('.number').text(), 10 );
},
name : function ( $elem ) {
return $elem.find('.name').text();
}
}
});
{% endhighlight %}
hiddenClass
- String
'isotope-hidden'
The class applied to item elements hidden by Filtering.
hiddenStyle
- Object
{ opacity : 0, scale : 0.001 }
The style applied to item elements hidden by Filtering.
itemSelector
- Selector
Restricts Isotope item elements to selector.
layoutMode
- String
'masonry'
resizeable
- Boolean
true
Triggers layout logic when browser window is resized.
sortAscending
- Boolean
true
Used with sorting. If true, items are sorted ascending: "1, 2, 3" or "A, B, C...". If false, items are sorted descending "Z, Y, X" or "9, 8, 7...".
sortBy
- String
The property name of the method within the `getSortData` option to sort item elements.
Looking at the `getSortData` example above, valid values would be `'symbol'`, `'number'`, or `'name'`.
visibleStyle
- Object
{ opacity : 1, scale : 1 }
The style applied to item elements made visible by Filtering.