scrollReveal.js

  • monroe1

    (@monroe1)


    9 years, 9 months ago

    I tried adding scrollReveal.js to my template theme by uploading the scrollReveal.js file to my theme files /js folder and then added this code to my functions.php file to add the .js file to the footer of theme. 

    //* Enqueue ScrollReveal.js
add_action( 'wp_enqueue_scripts', 'enqueue_scrollreveal' );
function enqueue_scrollreveal() {

wp_enqueue_script( 'scrollreveal', get_stylesheet_directory_uri() . '/js/scrollReveal.js', array( 'jquery' ), '', true );

}

    I then added the required code to animate a div and it sets the opacity of the div to 0 with no animation.

    data-scrollreveal="enter top"
    also tried..
    data-scroll-reveal="enter top"

    What could be the ordeal?

Viewing 9 replies - 1 through 9 (of 9 total)
  • Moderator Jose Castaneda

    (@jcastaneda)

    THEME COFFEE MONKEY

    9 years, 9 months ago

    Are you able to post a link?

    How and where are you using: window.scrollReveal = new scrollReveal();

    That’s one thing I can think of.

    Thread Starter monroe1

    (@monroe1)

    9 years, 9 months ago

    window.scrollReveal = new scrollReveal();

    Where would i put this?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    9 years, 9 months ago

    The best thing you can do to help us is to link your site

    Thread Starter monroe1

    (@monroe1)

    9 years, 9 months ago

    http://www.pagesdirect.net

    Link to site

    Thread Starter monroe1

    (@monroe1)

    9 years, 9 months ago

    I’ve been playing around with it and it seems to function now…?

    Thread Starter monroe1

    (@monroe1)

    9 years, 9 months ago

    i’m testing this on my homepage and am running into the same problems.

    Thread Starter monroe1

    (@monroe1)

    9 years, 9 months ago

    http://goo.gl/g36ics

    The middle area under the city silhouette is blank but has an h2 with scrollreveal data added and the opacity stays at 0. Is an event not being triggered? I just found this .js while putting my site together. thought it might be interesting to use and now i’m having 2nd thoughts.

    Thread Starter monroe1

    (@monroe1)

    9 years, 9 months ago

    The problem is def that I have the <h2> in a div named #sitewrapper that allows for the fading of the background on scroll but is also stopping scroll reveal from working on certain elements.

    How can I keep the scroll/fade of the top background image in #sitewrapper but make scrollreveal.js work at the same time?

    Moderator Jose Castaneda

    (@jcastaneda)

    THEME COFFEE MONKEY

    9 years, 9 months ago

    Have you read through the readme about how to use it?

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘scrollReveal.js’ is closed to new replies.