MaralS
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by MaralS
-
-
Hi,
I'm not an expert in GSAP and I have some troubles with my SVG animation.
Indeed, I want to create a pre-loading effect on my page but I have some issues regarding the delay. I made a screenshot which show my problem : https://vimeo.com/189758547
My SVG appears at the beginning of my animation but I want to reveal the SVG by animating the strokes.
Here is my JS code (the link to my codepen) :
$(window).load(function () { $(function () { var first = $('#firstletter'), second = $('#secondletter'), competences = $('.competence'), // Sample script for Tweening on a Timeline tl = new TimelineMax({ delay:0, paused: false, yoyo: false }); tl.fromTo([first, second], 3, { drawSVG: "100% 100%" }, { drawSVG: "0% 100% ", ease: SlowMo.easeOut }); tl.fromTo(competences, 1, { opacity: 0, top: 0 }, { opacity: 1, top: "50%" }); }); $('#loader-overlay').delay(5000).fadeOut('slow'); // 5 sec de délai avant que la div ne disparaisse });
Thank you for your help
Problem of delay on TweenMax
in GSAP
Posted
Thank you so much Mulegoat !