Trying to animate pseudoclass - Cannot tween a null target

[marius96]

Hi all, I'm trying to make animation in which the :before pseudo-class of the box is being scaled down when I click that button, but I can't seem to be able to do that.

:before renders correctly,  is there any way to make this work? If I place it on the .main-page div, it's working, but that's not what I'm looking for.

The codepen link is the barebones version of what I'm trying to achieve.

See the Pen MWWmaXZ by make96 (@make96) on CodePen.

[ZachSaucier]

Hey marius, welcome to the forums.

 

In your pen I'm getting a "DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules" error. That's likely the issue.

 

In order to avoid the need for CSSRulePlugin, why not make the element a "real" element and not a psuedo-element?

 

P.S. Unless you need support for IE8, it's recommended to use the double colon :: for pseudo-elements.