Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

CSSRulePlugin.getRule()

CSSRulePlugin.getRule( selector:String ) : Object

[static] Provides a simple way to find the style sheet object associated with a particular selector like ".myClass" or "#myID".

Parameters

selector: String

The name that exactly matches the selector you want to animate (like “.myClassName”).

 

Returns : Object

The style sheet object (or an array of them if you define only a pseudo element selector like :before)

Details

Provides a simple way to find the style sheet object associated with a particular selector like ".myClass" or "#myID". You'd use this method to determine the target of your tween. For example, let's say you have CSS like this:
.myClass {
color:#FF0000;
}
.myClass:before {
content:"This content is before.";
color:#00FF00;
}
And you want to tween the color of the .myClass:before to blue. Make sure you load the CSSRulePlugin.js file and then you can do this:
var rule = CSSRulePlugin.getRule(".myClass:before"); //get the rule
TweenLite.to(rule, 3, {cssRule:{color:"#0000FF"}});
Or you can feed the value directly into the tween like this:
TweenLite.to( CSSRulePlugin.getRule(".myClass:before"), 3, {cssRule:{color:"#0000FF"}});
Copyright 2017, GreenSock. All rights reserved. This work is subject to theterms of useor for Club GreenSock members, the software agreement that was issued with the membership.
×