Hello,
I'm playing around with GSAP for the first time. After a few minutes i already encounter a problem (god bless.)
I need to target .menu:before and .menu:after so i've installed CSSRule plugin.
This five lines of code return a DOMException:
const tl = gsap.timeline();
gsap.registerPlugin(CSSRulePlugin);
const menuBefore = CSSRulePlugin.getRule('.menu:before')
const menuAfter = CSSRulePlugin.getRule('.menu:after')
tl.from(menuBefore, {
cssRule: {
width: 0
},
duration: 1
});
Firefox Dev Edition: DOMException: "CSSStyleSheet.cssRules getter: Not allowed to access cross-origin stylesheet"
Chrome: CSSRulePlugin3.min.js:10 DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules
at Object.getRule (https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/CSSRulePlugin3.min.js:10:1094)
at http://localhost:8000/js/animations.js:13:33
So, i obviously made a mistake but i can't tell where.
Any help is appreciated.