Search the Community
Showing results for tags 'animations'.
Found 27 results
-
I've started with javascript and GSAP in my project. I've used Tweenlite.to() to change the opacity of some anchor tags. The animations are working absolutely great the first time I'm opening the page. But if I reload the page, the tweens are not working. I'm closing the tab and opening the page in a new tab and its working again. Why is it so? <--HTML file--> <html> <head> <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.13.1/TweenLite.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.13.1/plugins/CSSPlugin.min.js"></script> <script src="animations.js"></script> </head> <body> ... ... <nav> <a href="#" id="a_home" onMouseOver="inHome()" onMouseOut="outHome()"> Home </a> ... </nav> ... ... </body> </html> <--animations.js--> function inHome(){ TweenLite.to("#a_home",0.3,{css:{opacity: 1}}); } function outHome(){ TweenLite.to("#a_home",1.5,{css:{opacity:0.7}}); }
-
Hi, I just encountered a bug in Chrome (possibly other browsers too) leaving 1px trash during 3d animations, like n the attachment. All you need to do is add 1px border, or box-shadow to the animated element. If you don't want it to be seen - in color of background, or transparent: border: 1px solid rgba(0,0,0,0); border: 1px solid transparent; I hope it'll help someone. John.
