Search the Community
Showing results for tags 'getrule'.
-
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!
- 1 reply
-
- cssruleplugin
- after
-
(and 1 more)
Tagged with:
-
I have multiple buttons with the same class on a page. I have a mouseover event on the buttons and I want to update the :before pseudo on the current button. How would I pass in the current button so that not all buttons would update if i were to use the CSS class attached to all buttons? Is it possible to use `this` at all or would I have to apply a unique class to each button or something?
-
Hey Guys! I've recently discovered your awesome products and have been enjoying playing around with the examples. However, I've run into some trouble trying to implement it into my project haha. Yet confident this won't be a biggie for you guys. So , if it's not too much of a bother please take a look at the codepen attached to see what I mean. https://codepen.io/Raulito/pen/jmwXxp *Specifically, I keep getting the error 'cannot tween a null target' in the console , which stops all my other animations from running , when trying to use the CSSRulePlugin to target the :before pseudo element. *I've noticed that this error occurs and can be seen in the console both on codepen AND when doing local development without a server, but for some reason works when I'm developing it locally using XAMP. * Cheers, Raul.
- 3 replies
-
- scrollmagic
- cssruleplugin
- (and 6 more)