IE

[un4given 0 Likes (Newbie)]

I am getting the error "invalid argument" from TweenMax.min.js line 16 in IE9 simulating IE8. Im trying to test my TweenLite code in IE8 &> but cant get past this error.

 

Any help would be appreciated.

 

-----update-----

 

 

changed from TweenMax to TweenLite + CSSPlugin but now the error is popping up in the CSSPlugin script, line 14, character 12005.

 

 

 

D

Edited May 17, 2012 by un4given

[GreenSock 8,117 Likes (Superhero)]

What exactly are you trying to animate? (what properties?)

 

Any chance you could post super simple example HTML page code?

 

Please make sure you're using the latest download too, just for kicks.

[GreenSock 8,117 Likes (Superhero)]

I bet you were trying to animate margin or padding and you defined the value as a number, not a string (which is totally fine). There was a tweak needed to handle that scenario which was just implemented a few minutes ago, so please download the latest version and give it a shot. Sorry about any confusion there.

[un4given 0 Likes (Newbie)]

No I was/am defining as a string, not a number. Also updated the JS files.

 

The problem seems to be if I use transformOrigin. everything else work, well apart from rotations act like I am rotating a background images and the div is set to overflow:hidden.

 

Is TranformOrigin meant to work, or is it wishful thinking?

[GreenSock 8,117 Likes (Superhero)]

I'm having a hard time reproducing that problem - transformOrigin seems to work fine for me even in IE8. Can you please post your code?

 

Also, you do have position set to absolute, right? Otherwise IE will tend to clip things as it forces the original rectangle of the object to stay where it was in the flow of the document.

[un4given 0 Likes (Newbie)]

I saw my mistake of positioning right after posting but wasn't overly concerned about that, thanx though.

 

My code for transformOrigin:

 

----css-----

.origin{
position: absolute;
width: 50px;
height: 200px;
left: 500px;
top:20px;
background-color: blue;
}

-----js------
var origin = new TimelineMax({repeat:-1})
var o = $(".origin");
origin.to(o, 2, {css:{rotation:"360", transformOrigin:"center bottom"}});
origin.to(o, 2, {css:{rotation:"0", transformOrigin:"center bottom"}});

[GreenSock 8,117 Likes (Superhero)]

Ah yes - I see exactly what the problem is. You're using the "center" keyword which wasn't recognized inside CSSPlugin (I guess I assumed folks would either use 50% or omit the center keyword since it's the default but that was a faulty assumption). I just uploaded a version that recognizes that keyword. Please give it a shot and let me know if it works for you. Seemed to work well for me even in old versions of IE.

[un4given 0 Likes (Newbie)]

Yep, that worked! thanking you.