let ImageReveal = CSSRulePlugin.getRule('.img__container::after')
let tl = new TimelineLite()
useEffect(() => {
tl.to(container, 0, { css: { visibility: 'visible' } })
.to(ImageReveal, 1.8, {
width: '0%',
ease: Power2.easeInOut,
})
.to(image, 1.4, { scale: '1.0', ease: Power2.easeInOut, delay: -1.6 })
}, [ ])
I want ImageReveal pseudo element to have 0% width with animation once the component has been mounted. But whenever Im reloading the page , it is lagging too much, the width is becoming 0% but without any effect of animation.
Please help!