Jump to content
GreenSock

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

GSAP working in Chrome, but not FF or ie8/9 (colorBox)

Go to solution Solved by PointC,

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hello Forum-

   I am experienced Flash Designer, who is trying to create an HTML5 experience...  

 

I have inline HTML YouTube video with a text panel that flys in from the bottom using GreenSock when "supplies" or "Steps in Procedure" are clicked.  Everything is great in Chrome, but the panel is invisible in Firefox and ie8 and ie9... It is a silent failure, and was hoping someone may have ideas.

 

Link to website is above.

 

Thanks!

Joel

 

I have added a CodePen...

 

When I test from firefox, and ie, nothing happens

post-31481-0-70142800-1452537497_thumb.png

post-31481-0-61632400-1452537499_thumb.png

See the Pen jWwwbx by anon (@anon) on CodePen

Link to comment
Share on other sites

Hello Joel (jkell), and welcome to the GreenSock forum!

 

I am seeing the same modal content in both latest Chrome and in Firefox 43 on Windows 7 (64-bit) . the only difference is that Chrome has the play button in red.

 

Also do you have a GSAP specific question? This looks more like a CSS related question with the positioning of the youtube video and text in the modal.

 

:)

  • Like 2
Link to comment
Share on other sites

The issue is not appearance of the colorbox, with youtube player, but the text overlaying on-top of the YouTube video when the "supplies" or "Steps in Procedure" buttons are clicked.  I am using GSAP to move the div with text, and it doesnt seem to be working in Firefox or IE8... I added Code Pen

Link to comment
Share on other sites

For that type of support we are really gonna need a reduced codepen demo so we can see what might be causing it. Just one of the links with one modal and just your GSAP code. Since it would be easier to test your code in a live editable environment like on codepen.

 

Here is a nice video tut on how to create a codepen demo example:

 

 

Thanks :)

  • Like 1
Link to comment
Share on other sites

  • Solution

If you move your changeSupplies and changeTitle functions above your tweens, it works fine in Firefox. :)

  • Like 1
Link to comment
Share on other sites

See the Pen MKooJL by anon (@anon) on CodePen

 

Here is a code pen with the buttons stripped out and just the text panel sliding up.

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.
×