Fxpack.js

More Specific Effects.

Author

Valerio Proietti, http://mad4milk.net

License

MIT-style license.

Dependencies

Moo.js, Function.js, Array.js, String.js, Element.js, Fx.js

Summary
Fxpack.js More Specific Effects.
Fx. Scroll The scroller effect; scrolls an element or the window to a location.
Properties
down Scrolls an element down to the bottom of its scroll height.
up Scrolls an element up to the top of its scroll height.
Fx. Slide The slide effect; slides an element in horizontally or vertically, the contents will fold inside.
Properties
hide Hides the element without a transition.
show Shows the element without a transition.
toggle Hides or shows a slide element, depending on its state;
Fx. Color Smoothly transitions the color of an element; Extends Fx.Base, inherits all its properties.
Properties
custom Transitions one color of the element specified in class creation smoothly from one color to the next.
fromColor Transitions from the color passed in to the current color of the element.
toColor Transitions to the color passed in from the current color of the element.

Fx. Scroll

The scroller effect; scrolls an element or the window to a location.  Extends Fx.Base, inherits all its properties.

Arguments

el the $(element) to apply the style transition to
options the Fx.Base options (see: Fx.Base)
Summary
Properties
down Scrolls an element down to the bottom of its scroll height.
up Scrolls an element up to the top of its scroll height.

Properties

down

Scrolls an element down to the bottom of its scroll height.

up

Scrolls an element up to the top of its scroll height.

Fx. Slide

The slide effect; slides an element in horizontally or vertically, the contents will fold inside.  Extends Fx.Base, inherits all its properties.

Note

This effect works on any block element, but the element cannot be positioned; no margins or absolute positions.  To position the element, put it inside another element (a wrapper div, for instance) and position that instead.

Options

mode set it to vertical or horizontal.  Defaults to vertical. and all the Fx.Base options

Example

var mySlider = new Fx.Slide('myElement', {duration: 500});
mySlider.toggle() //toggle the slider up and down.
Summary
Properties
hide Hides the element without a transition.
show Shows the element without a transition.
toggle Hides or shows a slide element, depending on its state;

Properties

hide

Hides the element without a transition.

show

Shows the element without a transition.

toggle

Hides or shows a slide element, depending on its state;

Fx. Color

Smoothly transitions the color of an element; Extends Fx.Base, inherits all its properties.

Credits

fx.Color, originally by Tom Jensen (http://neuemusic.com) MIT-style LICENSE.

Arguments

same arguments as Fx.Style, only accepts color based properties.

Example

var myColorFx = new Fx.Color('myElement', 'color', {duration: 500});
myColorFx.custom('000000', 'FF0000') //fade from black to red
Summary
Properties
custom Transitions one color of the element specified in class creation smoothly from one color to the next.
fromColor Transitions from the color passed in to the current color of the element.
toColor Transitions to the color passed in from the current color of the element.

Properties

custom

Transitions one color of the element specified in class creation smoothly from one color to the next.

Arguments

from the starting color
to the ending color

Note

Both values can be any of the following formats: ‘#333’ - css shorthand with the hash ‘333’ - or without the hash ‘#333333’ - css longhand with the hash ‘333333’ - without the hash

fromColor

Transitions from the color passed in to the current color of the element.

Arguments

color the color to transition from to the current color of the element.

Example

myColorFx.fromColor('F00') //transition from red to whatever color the element is currently

toColor

Transitions to the color passed in from the current color of the element.

Arguments

color the color to transition to from the current color of the element.

Example

myColorFx.toColor('F00') //transition from whatever color the element is currently to red
Base class for the Mootools fx library.
My Object Oriented javascript.
Contains Function prototypes, utility functions and Chain.
function $A( array )
Copy the array and returns it.
Same as Array.copy, but as function.
Contains Array prototypes and the function $A;
Contains String prototypes and Number prototypes.
function $( el )
returns the element passed in with all the Element prototypes applied.
Contains useful Element prototypes, to be used with the dollar function $.
Applies visual transitions to any element.
The Style effect; Extends <Fx.Base>, inherits all its properties.