i am using gsap basic animation like translations and show or hide but the animation sometime do not go smoothly i don't know if i can post my demo website link but if anyone want to see the web i can comment on this post
chars = mySplitText.chars;
tl.staggerFrom(chars,0.01, {opacity:0, ease: Expo.easeInOut}, 0.11, "+=0.1");
tl.to(skip,1,{display: 'block',ease: Expo.easeIn},2);
tl.to(bodycontent,1,{display:'block'},9);
tl.to(textHolder,1,{display:'none',ease: Expo.easeIn},9);
tl.to(txt,.1,{display:'none',ease: Expo.easeIn},9)
tl.to(showafter, 2, {y:-7000,rotation:45,scale:4,ease: Expo.easeIn},9);
tl.to(showafter1, 2, {y:7000,rotation:45,scale:4,ease: Expo.easeIn},9);
tl.to(showafter, 2, {opacity:0,display:'none',ease: Expo.easeIn},10);
tl.to(showafter1, 2, {opacity:0,display:'none',ease: Expo.easeIn},10);
tl.to(body, 1, {overflowY:'auto',ease: Expo.easeIn},10);
tl.to(welcome,2,{display: 'block',opacity:1,ease: Expo.easeIn},10);
tl.to(bodycontent,2,{borderStyle:'solid',borderWidth: '48px',borderColor:'#fff',ease: Expo.easeIn},12);
tl.to(bar,2,{display:'block',height:'48px',backgroundColor:'#fff',ease: Expo.easeIn},12);
tl.to(bar2,2,{display:'block',width:'48px',backgroundColor:'#fff',ease: Expo.easeIn},12);
tl.to(bar3,2,{display:'block',height:'48px',backgroundColor:'#fff',ease: Expo.easeIn},12);
tl.to(social, 2, {opacity:1,ease: Expo.easeIn},12);
tl.to(skip,1,{display: 'none',ease: Expo.easeIn},12);
tl.to(welcome,1,{display: 'none',opacity:0,ease: Expo.easeIn},12);
tl.to(cloud, 1, {x:-400,y:'15%',position:'fixed',ease: Expo.easeIn},12);
tl.to(cloud, 1, {scale:0.75,ease: Expo.easeIn},12);
tl.from(about, 2, {x:100,ease: Expo.easeIn},12);
tl.to(about, 2, {opacity:1,ease: Expo.easeIn},12);
tl.to(nav,2,{opacity:1,ease: Expo.easeIn},12);
tl.from(nav,2,{x:100,ease: Expo.easeIn},12);
