Scroll animations in Genesis using AniView

AniView is jQuery plugin that works in harmony with Animate.css in order to enable animations only when content comes into view. It is similar to WOW.js that I wrote about in the past.

AniView is relatively new and not as popular as WOW.js but is lighter than WOW.

This tutorial covers

• using post_class filter hook to add aniview class needed by AniView to each entry on content archives.
• using genesis_attr_entry filter hook to add av-animation data attribute needed by AniView with value set to a Animate.CSS's class.
• using wp_enqueue_scripts action hook to load Animate.CSS in the head, AniView and AniView's initialization script in the footer.

to fade in the posts in content archives (like Posts page, category archives..) as they are scrolled to.

Step 1

Upload animate.min.css to child theme's css (create if not existing) directory.

Step 2

a) Download jquery.aniview.min.js to your computer and edit it.

Change