Fernando

ok, thank you. I'll try to covert height pixels into scale and let you know how it goes. Regards

Hello, I'm having some trouble with a transformation. Take a look at the example: http://cdpn.io/eoGnI When you click on some text to expand, the red square should remail aligned to the left. The transformation should take the bottom left corner as it's origin point, and grow to the right. Instead it grows from the center. Is there someting I'm doing wrong? I would appreciate any advice on the matter. Thanks in advance

Hi, Since last Firefox upgrade something really extrange started to happen. Take a look at the image. The web has white background. I have the buttons and some lines animated behind. Well, when the lines fade in behind the rectangle buttons, the background turns black except for some areas that remain white. After the fade in finishes, background goes back to white, and everything works fine from now. This only happens in Firefox (not Safary, not Chrome). Do you know what could cause this behaviour? Thanks in advance

Hi, I wonder if it would be possible to change the origin of the transformation, sort of what 'TransformAroundPointPlugin' did for AS. If you tween the height of an element, it grows downwards. Is it possible to make it grow upwards? Regards

Yes, that's what I thought. I managed to achive it with a div instead. Thanks again.

Hello, I'm trying to change the background image with something like this: $("body").css("background", "url('" + imgLink + "')"); but I don't know how to fade in new images. Is it possible with the backgroung of the body? I'd rather not use a div for this. Thanks in advance.

Ok, thank you. That looks great. I'm used to actionscript and sometimes this little things drive me crazy.

I guess I could also use jquery selector, right? $('bot'+num) I finally created an array instead of individual elements. Makes more sense. I have another problem selecting elements. I want to assign some behaviours to the buttons with this loop: for (var i=0;i<5;i++) { tapa[i].parent().mouseenter(function() {bgChange(i,0);}); tapa[i].parent().mouseleave(function() {bgChange(i,1);}); } Then the function: function bgChange(elem,tipo){ if(tipo==0) { TweenLite.to(tapa[elem], .2, { backgroundColor:menuColorIdle[elem], ease:Cubic.easeOut}); }else { TweenLite.to(tapa[elem], .5, { backgroundColor:menuColorOver[elem], ease:Power1.easeOut}); } } The problem is that the tween only sees i=5, instead of assigning secuential numbers to the functions. I just don't know how to pass the value. Thank you.

What I did is use a function like so: bgChange($(this).find('div:first-child')); function bgChange(cual){ var str=cual.attr('id'); TweenLite.to(cual, .2, { backgroundColor:menuColorIdle[str.charAt( str.length-1)], ease:Cubic.easeOut}); };

Hi, I have several buttons named secuentially (bot0, bot1, bot2...) and I'd like to be able to select them individually within a tween. Is there a way to achive that? I'm pretty new to js and I don't know if that's possible. Here's the tween: TweenLite.to(bot0, .2, { backgroundColor:menuColorIdle[str.charAt( str.length-1)], ease:Cubic.easeOut}); I'd like to be able to select, let's say, bot2 without changing much. Passing 2 to a function for example. Thanks in advance

Hi, I'm trying to change only the alpha of the background without affecting the color of the element. I have 5 elements each with a different color, and I'd like to change only the transparency of all of them with a simple tween, like so: TweenLite.to([bot0,bot1,bot2,bot3,bot4], .3, {opacity:0.85, ease:Cubic.easeOut}); But of course, that changes the opacity of the whole element and not only the background. If I include the 'backgroundColor' property instead, I'd be altering the color as well. Is there any way to achieve this? Thanks in advance

I suppose it could work, but it duplicates tween calls. I'll give it a try and let you know. Thanks

I come from actionscript tweenLite, and I was wondering if you still could overwrite the variable to change the tween like in actionscript like so: var myTween=tweenLite.to(object,1,{left:"10px"}); myTween=tweenLite.to(object,1,{right:"5px"}); What I would like is a mouseover animation, but a different one mouseout animation (not just reversing the tween). Here's what I have now: var bot0 = $("#tapa0"); clipTween40 = TweenLite.to(bot0, .2, {top:"-192px", backgroundColor:"rgba(172, 221, 255,.85)", ease:Cubic.easeOut, paused:true}); bot0.parent().mouseenter(function() {clipTween40.play();}); bot0.parent().mouseleave(function() {clipTween40.reverse();}); Maybe by overwriting the tween... I've tried without much success.

I figured it out using this: TweenMax.to(bot0, .2, {css:{top:"-192px", backgroundColor:"rgba(172, 221, 255,.85)"}, ease:Cubic.easeOut, paused:true}); I need that transparency, so I'll check what it looks like in ie8. Thank you. I'll remove the css wrapper.

Hello, I', trying to make an animation of a DIV which moves on mouse over, and I wanted to change opacity of the background only. Here's what I'm doing to move the object. clipTween= TweenLite.to(bot1, .2, {css:{top:"-192px"}, ease:Cubic.easeOut, paused:true}); This works ok, but when I add the colorProps, just stops working alltoghether. I've tried everything. Any help would be much appreciated. Regards, Fernando