CSSRulePlugin.getRule
CSSRulePlugin.getRule( selector:String ) : Object
[静态] 提供了一种简便的方法来查找与特定选择器相关的样式表对象,例如".myClass"
或者"#myID"
.
参数
选择器:字符串
完全匹配你想要动画化的选择器的名称(例如
".myClassName"
)。
返回值:对象
样式表对象(或者如果你仅定义了一个伪元素选择器,如::before
)。
细节
提供了一种简便方式来查找与特定选择器(例如.myClass
或者#myID
。你可以使用此方法来确定你的补间动画的目标。
例如,假设你有如下 CSS:
.myClass {
color: #FF0000;
}
.myClass::before {
content: "This content is before.";
color: #00FF00;
}
并且你想对.myClass::before
设置为blue
。请确保加载了CSSRulePlugin.js文件,然后你可以这样操作:
var rule = CSSRulePlugin.getRule(".myClass::before"); //get the rule
gsap.to(rule, {duration: 3, cssRule: {color: "#0000FF"}});
或者你可以直接将值传入补间动画中,如下所示:
gsap.to(CSSRulePlugin.getRule(".myClass::before"), {
duration: 3,
cssRule: { color: "#0000FF" },
});