Search the Community
Showing results for tags 'top'.
Found 4 results
-
Is it possibe to scale a div with TweenMax but I would like to maintain or reset the CSS top and left position? Below are a few failed attempts. It seems TweenMax always scales from the center point. TweenMax.fromTo('#div-name', 2, {scaleX:.5, scaleY:.5}, {css:{top:0, left:0}}); or TweenMax.to('#div-name', 2, {scaleX:.5, scaleY:.5}); $("#div-name").css({ top: '0px', left: '0px' }); The Codepen URL shows the red div scaling but not maintaining the top: 0 and left: 0 desired position.
-
Hi Greenies I have successfully designed my animations of lines of skills (except perfection in portrait) As the last effect I am loading a graphic of my business card ("#ezpc") and want it full screen The start position (except in 1920x1080) appears in the wrong position The destination Left & Top are also appearing in the wrong position When I debug the code the start and stop positions are correct but the graphic has it's own mind! I am sure that I am not "clearing" properly or perhaps I cannot use the same #demo container You may see my addGraphic() function attempting to kill the previous Tweens but that stops the first bit I know the majority of the code is quite unreadable due to it's complexity but can anyone give me any tips about resetting the page somehow prior to the loading of the graphic? The code is on CodePen as: http://cdpn.io/xHytr (full page) or http://codepen.io/thorntontf/pen/xHytr Thanks for any help you can give Trevor
-
So I have been searching for a way to have a background orbit a center. I came across the greensock blitmask that does an amazing job of wrapping the bitmap data to do infinte scrolling effects. However, I can't figure out a way to use this blitmask to rotate and still have the wrapping effect. I attached a SWF file to demostrate what i'm trying to accomplish. WASD keys control the movement cosc469.zip
-
Hello, I have the following code: $(document).live('keydown',function(event){ var key = event.keyCode; if(key==39){ TweenMax.to($("#hero"),0.1,{css:{'left':$("#hero").position().left+40}}); } else if(key==37){ TweenMax.to($("#hero"),0.1,{css:{'left':$("#hero").position().left-40}}); } else if(key==38){ TweenMax.to($("#hero"),0.3,{css:{'rotation':-30}}); TweenMax.to($("#hero"),0.1,{css:{'top':$("#hero").position().top-10}}); TweenMax.to($("#hero"),0.6,{css:{'rotation':0}}); } else if(key==40){ TweenMax.to($("#hero"),0.1,{css:{'top':$("#hero").position().top+10,'rotation':30},onComplete:function(){ TweenMax.to($("#hero"),0.1,{css:{'rotation':0}}); }}); } }); What this does is to read the "arrow" keys from the keyboard and move the element (hero) up/down/left/right However when pressing the down button continually, the element goes up instead of down, it does not do that when there is no rotation however. For some reason rotating the object gives it wrong .position().top value. It used to mess up moving upwards too, but I solved it by resetting the rotation to 0 after the animation (still its a workaround though). Anyone knows why is this happening? Or how it could be solved/worked around? You can view this here: http://www.netgfx.com/trunk/scrollingBG/ Thanks in advance.
