the compact javascript framework
in partnership with mediatemple
Contains Fx.Style
MIT-style license.
Fx. Style.js | Contains Fx.Style |
Fx. Style | The Style effect, used to transition any css property from one value to another. |
Properties | |
hide | Same as Fx.Base.set (0); hides the element immediately without transition. |
set | Sets the element’s css property (specified at instantiation) to the specified value immediately. |
start | Displays the transition to the value/values passed in |
Element | Custom class to allow all of its methods to be used with any DOM element via the dollar function $. |
Properties | |
effect | Applies an Fx.Style to the Element; This a shortcut for Fx.Style. |
The Style effect, used to transition any css property from one value to another. Includes colors. Colors must be in hex format. Inherits methods, properties, options and events from Fx.Base.
el | the $(element) to apply the style transition to |
property | the property to transition |
options | the Fx.Base options (see: Fx.Base) |
var marginChange = new Fx.Style('myElement', 'margin-top', {duration:500}); marginChange.start(10, 100);
Properties | |
hide | Same as Fx.Base.set (0); hides the element immediately without transition. |
set | Sets the element’s css property (specified at instantiation) to the specified value immediately. |
start | Displays the transition to the value/values passed in |
Same as Fx.Base.set (0); hides the element immediately without transition.
Sets the element’s css property (specified at instantiation) to the specified value immediately.
var marginChange = new Fx.Style('myElement', 'margin-top', {duration:500}); marginChange.set(10); //margin-top is set to 10px immediately
Displays the transition to the value/values passed in
from | (integer; optional) the starting position for the transition |
to | (integer) the ending position for the transition |
If you provide only one argument, the transition will use the current css value for its starting value.
var marginChange = new Fx.Style('myElement', 'margin-top', {duration:500}); marginChange.start(10); //tries to read current margin top value and goes from current to 10
Custom class to allow all of its methods to be used with any DOM element via the dollar function $.
Properties | |
effect | Applies an Fx.Style to the Element; This a shortcut for Fx.Style. |
Applies an Fx.Style to the Element; This a shortcut for Fx.Style.
property | (string) the css property to alter |
options | (object; optional) key/value set of options (see <Fx.Style>) |
var myEffect = $('myElement').effect('height', {duration: 1000, transition: Fx.Transitions.linear}); myEffect.start(10, 100); //OR $('myElement').effect('height', {duration: 1000, transition: Fx.Transitions.linear}).start(10,100);
returns the element passed in with all the Element prototypes applied.
Documentation by Aaron Newton & Mootools Developers, generated by NaturalDocs and GeSHi