You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
30 lines
2.2 KiB
HTML
30 lines
2.2 KiB
HTML
<h2>Options<a href="#options"></a></h2>
|
|
|
|
<p>Settings you can change (these are the defaults).</p>
|
|
<div class="code-block">
|
|
<pre rel="JavaScript"><code class="language-javascript">// Overrideable options
|
|
Shuffle.options = {
|
|
buffer: 0, // Useful for percentage based heights when they might not always be exactly the same (in pixels).
|
|
columnThreshold: 0.01, // Reading the width of elements isn't precise enough and can cause columns to jump between values.
|
|
columnWidth: 0, // A static number or function that returns a number which tells the plugin how wide the columns are (in pixels).
|
|
delimiter: null, // If your group is not json, and is comma delimeted, you could set delimiter to ','.
|
|
easing: 'cubic-bezier(0.4, 0.0, 0.2, 1)', // CSS easing function to use.
|
|
filterMode: Shuffle.FilterMode.ANY, // When using an array with filter(), the element passes the test if any of its groups are in the array. With "all", the element only passes if all groups are in the array.
|
|
group: Shuffle.ALL_ITEMS, // Initial filter group.
|
|
gutterWidth: 0, // A static number or function that tells the plugin how wide the gutters between columns are (in pixels).
|
|
initialSort: null, // Shuffle can be initialized with a sort object. It is the same object given to the sort method.
|
|
isCentered: false, // Attempt to center grid items in each row.
|
|
itemSelector: '*', // e.g. '.picture-item'.
|
|
roundTransforms: true, // Whether to round pixel values used in translate(x, y). This usually avoids blurriness.
|
|
sizer: null, // Element or selector string. Use an element to determine the size of columns and gutters.
|
|
speed: 250, // Transition/animation speed (milliseconds).
|
|
staggerAmount: 15, // Transition delay offset for each item in milliseconds.
|
|
staggerAmountMax: 150, // Maximum stagger delay in milliseconds.
|
|
throttle: throttle, // By default, shuffle will throttle resize events. This can be changed or removed.
|
|
throttleTime: 300, // How often shuffle can be called on resize (in milliseconds).
|
|
useTransforms: true, // Whether to use transforms or absolute positioning.
|
|
};</code></pre>
|
|
</div>
|
|
|
|
<p>No options <em>need</em> to be specified, but <code>itemSelector</code> should be used. Other common options to change are <code>speed</code> and <code>sizer</code>.</p>
|