it en en en en en en en en en en en en en en en fa en en fr hbs_lat en en en es en en en ms en de en fr en en en ca en en en en en en en it it en en de en en en en en en en en fr en en de en en en en en en en en nb en en en en en en en en en en en en en en en en en en nb en en en en en en en en en en en en en en en en en en nb en en en en en en en en en en en en en en en en en en nb en en en en en en en en en en en en en en en en en en nb en en en en en en en en en en en en en en en en en en nb en en en en en en en en en en en en en en en en sv en en nb en en en en en en es ms fr en en en en en en en nb en en en en en en es ms fr en en en en en fr en nb en fr en en it en en hbs_lat en en en en en en en en nb en en en en en en es ms fr en en en en en en en nb en en en ru en en en en en en en en en en en en en en en nb en en en ru en en en en en en en en en en en en en en nb en en en en en en es ms fr en en en en en en en nb en en en ru en en en en en en en en en en en en en en en nb en en en ru en en en en en en en en en it en de en de en en en en en en en de en en en en en de en en en en en en en fr cv es tr es en en en en ms en en en en en en fr en hbs_lat en en en en en en en fr cv es tr es en en en en de en en en ca en en en en en
Add acction to a video
pati posted a topic in GSAP
pati replied to pati's topic in GSAP
OSUblake, I'm using an image of a city and I am animating some elements of that image like sea, clouds, etc. So, what I would like to do is to add that animated waves to the sea to give it the sensation that it's moving. For it, I was trying to apply the code that you gave me, but I'm afraid it's very advance to me. What I would like to do is to have two animated waves (like the first image attached), but like 5 times over the sea (second image attached).
pati posted a topic in GSAP
I am having some troubles with the document.querySelectorAll() because, I don't know why, it doesn't work when I add more than one class or ID. So, this is what I want to achieve: http://codepen.io/sonder15478/pen/PpJqKN But there's a lot of code that I wouldn't need if I use document.querySelectorAll(). This is where I get stuck: http://codepen.io/sonder15478/pen/xqXGXm I also tried with getElementsByClassName(), but it didn't work either... Any ideas? Thank you!
pati replied to pati's topic in GSAP
You just saved my day PointC! Thank you very much!!
pati replied to pati's topic in GSAP
Hi PointC, I'm actually working with the first code that you suggested me and I am very close to get what I need. There's only one thing left that I am not able to do... Do you know hoy can I modify this wave: http://codepen.io/osublake/pen/7c235b8b3c2d9bb6cecea6acfff7ff37/ to look much smaller? The width and height? I would like to look like the image attached... Sorry I'm just learning JS Thank you for your help
Animation doesn't work on file, but it does work on Codepen. Why?
pati posted a topic in GSAP
Hi, I've created this animation: http://codepen.io/anon/pen/VerMWX, but when I paste it to my code, it doesn't work... do you know if I need to add a link to a Greensock file or something like this. The only link that I have on my header at the moment is:
pati replied to pati's topic in GSAP
Hi PointC, Yes, I've read that article before but I don't know how to apply it to my code... I am just starting with Greensock. This is what I have at the moment (JS is the one that you just told me): http://codepen.io/sonder15478/pen/jBwGWY Thank you
Percentage animation based on parent width
pati replied to pati's topic in GSAP
You're right Jonathan. That's because on my file I had images instead of forms and when I pasted my code to codepen, I forgot to delete the width and height. Also, do you know how can I fix this? https://greensock.com/forums/topic/16143-animated-waves-effect/
Percentage animation based on parent width
pati replied to pati's topic in GSAP
That's exactly what I was looking for! Thank you very much for your help Shaun Gorneau
pati posted a topic in GSAP
Hi, I would like to animate two lines as they move as waves. I want something like this, but with the two lines and moving slowly, like the sea. http://codepen.io/winkerVSbecks/pen/EVJGVj Does anyone know how to do this? Thank you
Percentage animation based on parent width
pati replied to pati's topic in GSAP
Thank you for your quick answer. I'm afraid is my first time using Greensock so I don't know how to do that. So if I have a parent div with a 500px width and I want to move an element 20% of the parent width, how can I do that?
Percentage animation based on parent width
pati posted a topic in GSAP
Hi, I am creating a responsive animation where there's an image on the background and some elements of it are animated. For example, I would like to move a cloud 20% of the screen width, but with the code that I have, it's moving it but of a 20% of the cloud width. Does anyone know how to do it of the screen width instead of the cloud width? This is my code: TweenMax.to('#cloud', 5, { x:"20%", ease:Power1.easeInOut, yoyo: true, repeat:-1 });
“There is no doubt that GreenSock is currently the best available tool for creating astonishing interactive websites and animation effects.”
“@greensock it’s a great library that many people love, and I know you care deeply about performance :)”
“GSAP is awesome - I just dropped all my [custom] code, like a thousand lines of code and everything is so so much simpler, smoother and much easier to read for other developers! You have no idea how cool it is to offload that thought process to you guys!”
“I really need to commit to using GSAP more in my daily work & demos. I love pushing native CSS animation as far as I can but every time I use GSAP I’m just blown away. Keep up the great work!”
“Performance has been of paramount importance for GreenSock, so there is always peace of mind for us, developers.”
“I can definitely say ever since I started using GSAP, my work exponentially improved. It basically changed my life.”
“No other animation library is as intuitive, rigorous, conceptually simple and well curated as GreenSock’s.”
“@greensock is just pure awesomeness. What more can be said?”
“This stuff is so incredibly amazing I can't believe it. The level of details and options put into these things and the natural instinct GreenSock has for solving everyday problems is impressive.”
Sign Up For Our Newsletter
Get the latest updates on GreenSock products, exclusive offers, and more right in your inbox.
Your information will always be kept confidential.
Thanks for signing up!
Now you'll begin receiving the latest GreenSock updates, exclusive offers, and more right in your inbox. Welcome aboard.