Search the Community
Showing results for tags 'swing'.
Found 3 results
-
"Swing" motion stops after first swing, only then continues naturally
Robert Wildling posted a topic in GSAP
Hi, fellow GSAPers! May I ask for your help, please?!? The codepen shows a pendulum like motion - or should. Because for some reason, after the very first pendulum motion, there is a strange delay. Only then it continues naturally. Do you happens to know why? And what the solution would be? Thank you! -
I have this line: .from('.jersey', 15, { rotation: 3, transformOrigin:"center top", ease: 'elastic.out( 5, 0.1)', repeat: -1}, "-=0.2") There is a way to make the swing stops before the 15sec?
-
Swinging / Swaying objects hanging off hook effect with physics?
Rockethouse posted a topic in GSAP (Flash)
Hey guys, Im building a product listing page that looks like the product is hanging off a hook on a rail, and its using a carousel plugin to scroll left to right (as if the items were sliding along the rack). What i'm trying to achieve with Tweenmax is a real life type swinging effect. So each item would be very slowly swaying from wind movements, and then if you hover over it the item would swing or sway more. As well as this when you drag the carousel or click next / prev buttons, the items would slide across and "drag" as they would in real life, being anchored at the top of the hook. I've done a simple prototype with css3 but it's just not cutting it! It needs to be better! I'm very new to TweenMax so i'm not even sure if its possible, but if anyone can help or let me know if what I want to achieve is possible that would be awesome! The other thing is that I want it to be kind of dynamic... so each item sways at its own speed or direction so they don't all look the same... Prototype CSS3 example: http://kulas-hagenes-and-kutch8587.myshopify.com/ I've done some searching and found a few examples that are close to what I'm after: http://pieterbraam.nl/swing/ http://codepen.io/jamiejefferson/pen/zjsCl http://jsfiddle.net/rhernando/qTSnC/3/ - missing the image Cheers!
