neilgee
11/6/2014 - 9:59 AM

ScrollReveal.js in Genesis

ScrollReveal.js in Genesis

<?php

//do not add in opening php tag
 
/**
 * Add in ScrollReveal.js in a Genesis Theme
 *
 * @package   Add in ScrollReveal.js in a Genesis Theme
 * @author    Neil Gee
 * @link      http://wpbeaches.com/using-scrollreveal-js-wordpress-genesis-theme/
 * @copyright (c)2014, Neil Gee
 **/
 
 
 
//Enqueue the ScrollReveal main script
function themeprefix_scroll_reveal() {
 
 wp_enqueue_script ('scrollreveal', get_stylesheet_directory_uri() . '/js/scrollReveal.min.js', array( 'jquery' ),'2.0.5',true );
}
 
add_action( 'wp_enqueue_scripts', 'themeprefix_scroll_reveal' );


//ScrollReveal JS initialise Script
function themeprefix_scroll_reveal_fire() {
 ?>
   <script>
 
 var config = {
        easing: 'hustle',
        vFactor: 0.25,
        mobile: true,
        enter: 'bottom',
        reset: true
      }
 
      window.sr = new scrollReveal( config );
 <?
}
add_action( 'wp_footer','themeprefix_scroll_reveal_fire', 100 );


//Optional - Initially hide data-sr elements whilst page loads
function themeprefix_scroll_reveal_inlinecss() {
?>
<style> [data-sr] { visibility: hidden; } </style>
<?
 
}
add_action( 'wp_head','themeprefix_scroll_reveal_inlinecss' );