Hi,
So I have this code:
var toggleInfo = function(){
var info = new TimelineLite();
$('.info-open').click(function(e){
e.preventDefault();
info.to('.info', 0, { css: { className: "-=display-none"}, immediateRender:false});
info.to('.info', 0, { css: { className: "+=flex"}, immediateRender:false});
info.from('.info', 0.4, { css: { transform: "scale(0.2) translateZ(0)", opacity: 0 }, ease: Power3.easeOut, force3D: "auto"});
info.staggerFrom('.about span', 0.4, { css: { transform: "translateY(60px) translateZ(0)", opacity: 0}, ease: Power3.easeOut, force3D: "auto"}, 0.1);
info.staggerFrom('.contact li', 0.4, { css: { transform: "translateY(-30px) translateZ(0)", opacity: 0}, ease: Power3.easeOut, force3D: "auto"}, 0.1);
info.from('.info-close', 0.2, { css: { transform: "translateY(-60px) translateZ(0)", opacity: 0}, ease: Power3.easeOut, force3d: "auto"});
});
$('.info-close').click(function(e){
e.preventDefault();
info.reverse().timeScale(2);
});
}
And it works fine the first time i click the triggers. However, when I click "info-open" again after I have clicked "info-close", it fires info.reverse(). This is an overlay im toggling and the first open and close works, but when i want to open it again it only fires the reverse animation thus closing the overlay.
