We've made some custom animation functions that will transition your content. It's recommended to use this with our ScrollFire Plugin to make your content transition in as you scroll.
showStaggeredList
Use this to create a staggered reveal effect for any UL Tag with list items. Just make sure the list items in the UL are opacity: 0; to ensure the animation works correctly.
| Option Name | Description |
|---|---|
| selectorOrEl | The selector or element that the transition targets. |
Click Me
<a href="#!" class="btn" onclick="Materialize.showStaggeredList('#staggered-test')">Click Me</a>
fadeInImage
Use this to fade in images. It also animates grayscale and brightness to give it a unique effect.
| Option Name | Description |
|---|---|
| selectorOrEl | The selector or element that the transition targets. |
Click Me
<a href="#!" class="btn" onclick="Materialize.fadeInImage('#image-test')">Click Me</a>
