Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
alostdeveloper

Animations aren'ts working

Recommended Posts

I'm having trouble getting my animations to work. I've setup very basic animations to get started with, and nothing happens when I load them. 

gsap002.PNG

gsap001.PNG

Link to comment
Share on other sites

Have you tried to create said animations in CodePen?

 

Having us see a simplified example with markup and CSS will help us help you.

 

 

  • Like 3
Link to comment
Share on other sites

Hey alostdeveloper and welcome to the forums.

 

This is likely due to a loading issue of your assets but without seeing a live page it's very hard for us to help you figure out what's going wrong. Have you tried looking at your browser's console? Usually it will tell you if something is not loading or if you have a different error with your code.

  • Like 2
Link to comment
Share on other sites

Yup, perfectly functional in CodePen (by the way, use the Settings in CodePen to inject <head> stuff)

 

See the Pen dybGVGy by sgorneau (@sgorneau) on CodePen

 

Try loading only TweenMax (remove the <script> calling in TimelineMax.min.js)

  • Like 2
Link to comment
Share on other sites

I normally wouldn't load it like that, but this is a work project. So I need to figure out why it's not working outside of Codepen.

Link to comment
Share on other sites

Can you please host a live webpage that we are able to see that can reproduce your issue? Otherwise I'm afraid we can't really be of much more help.

Link to comment
Share on other sites

I think moving the scripts to the bottom of the page will solve this for you.

:)

 

  • Like 4
Link to comment
Share on other sites

As pointed out by PointC, the issue is that the script is trying to run before the DOM content that it's looking for is loaded.

 

If you need to keep the script in the head and can't move it to the bottom of the body, you should use the following instead:

 

document.addEventListener("DOMContentLoaded", function(event) { 
  // Your timeline code
});

 

  • Like 3
Link to comment
Share on other sites

Any ideas why the animation would be working in IE and Safari, but not Chrome?

Link to comment
Share on other sites

3 hours ago, alostdeveloper said:

Any ideas why the animation would be working in IE and Safari, but not Chrome?

It was working in Chrome when I moved the script on the live page that you had shared previously. So no, no ideas why that may be the case. Maybe you can share a live version of the page again so we can look?

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×