GSAP and Wordpress - yet again. -SOLVED!

[flash08]

OK, so I've properly enqueued TweenMax.min.js in my Wordpress install, in my child theme's functions.php file. It's loaded, as a check of the page shows.

 

Just to make sure it's working, I added this test code to a page's footer code:

 

<script type="text/javascript">
var blinkText = document.getElementsByClassName("blinking");

function blink() {
    TweenMax.to(blinkText, 0.3, {
        autoAlpha: 0,
        delay: 0.3,
        onComplete: function() {
            TweenMax.to(blinkText, 0.3, {
                autoAlpha: 1,
                delay: 0.3,
                onComplete: blink
            });
        }
    });
}
blink();
</script>
 

When this page loads, the text doesn't blink and the DOM inspector shows an error, reporting "Uncaught ReferenceError: TweenMax is not defined." I don't have much JS experience, but obviously I've missed something simple, and obvious. Can someone help me out here?

 

TIA!

 

SOLVED: Ach, what a pain. It was just a case of script loading and timing. I changed the example code to what I pasted in below, and it works fine in WP, via the OH Add Script Header Footer plug. This plug makes it simple to add things like GSAP scripts on a per-page basis without having to create separate files in the WP child theme.

 

<script type='text/javascript'>
// wait until DOM is ready
document.addEventListener("DOMContentLoaded", function(event) {

// wait until window is loaded (images, stylesheets, JS, and links)
    window.onload = function() {
    
//fade out and set visibility:hidden
TweenMax.to(blinking, 2, {autoAlpha:0});

//in 2 seconds, fade back in with visibility:visible
TweenMax.to(blinking, 2, {autoAlpha:1, delay:2});
    
    };

});
</script>