Homer has special small function animate-panel
that allowes you to implement staggering animations to any layout elements.
It is designed to work on any html elements in order to achive a effect of building layout on page load.
This function is mainly for main layout elements.
It is easy to use. All you have to do is to add new class .animate-panel
to wrapper of elements that should be staggering. For example:
<div class="animate-panel" data-effect="zomeIn" data-child="element"> <div class="element"></div> <div class="element"></div> <div class="element"></div> </div>
In default function get all .row > div
elements and applay zoomIn effect. You can use any effect avalible with Animatin.css library. You can find many example of use in Homer theme but feel free to play with examples below.