Hi guys.
Finally got the powers that be to agree to switch over to GreenSock for everything and my first demo project is a few banner ads.
All work perfectly except for in Firefox. I've searched and couldn't find anything that fits my scenario so posting new.
Here's my script from an expanding ad.
<script>
var $text = $('#text');
var $lock = $('#PadLock');
var $expand = $('#expandButton');
var $close = $('#closeButton');
var $UnlockText = $('#UnlockText');
var $key = $('#ring');
var $CTA = $('#clickthroughButton');
tl = new TimelineLite({paused:true});
tl2 = new TimelineLite({});
tl2.to($lock, .5, {rotation: 25, left:'95px', ease:Sine.easeInOut, top:'60px', transformOrigin:"left 50%",})
.to($lock, .5, {rotation: 5, left:'110px', ease:Sine.easeInOut, top:'78px', transformOrigin:"left 50%",})
.to($lock, .5, {rotation: 15, left:'103px', ease:Sine.easeInOut, top:'69px', transformOrigin:"left 50%",})
.to($lock, .5, {rotation: 10, left:'106px', ease:Sine.easeInOut, top:'74px', transformOrigin:"left 50%",});
TweenLite.from($text, 2, {left: '-200px', ease:Circ.easeInOut, delay: 1});
TweenLite.from($expand, 1, {bottom: '-50px', ease:Expo.easeIn, delay: 1.75});
tl
.from($key, 1.5, {rotation: -180, top: '-300px', left: '500px', ease:SteppedEase.easeIn}, '-=.5')
.to ($UnlockText, 1, {opacity: 1}, '-=.5')
.from($CTA, .75, {bottom:'-136px', ease:SteppedEase.easeInOut, transformOrigin:"left 50%"}, '-=.5')
.from($close, 1, {top: '-40px', ease:Circ.easeInOut});
$("#expandButton").click(function() {
tl.play();
});
</script>
I'm sure it's just some tiny thing that Firefox hates and is choking on, but have rewritten almost the entire thing piece by piece to no avail.
Any advice MUCH appreciated.