Fx. Smoothshow.js

Extends the Element object.

Dependancies

mootoolsMoo.js, String.js, Array.js, Function.js, Element.js, Dom.js

Author

Aaron Newton, <aaron [dot] newton [at] cnet [dot] com>

Summary
Fx. Smoothshow.jsExtends the Element object.
Fx. SmoothShowTransitions the height, opacity, padding, and margin (but not border) from and to their current height from and to zero, then set’s display to none or block and resets the height, opacity, etc.
Properties
hideTransitions the height, opacity, padding, and margin (but not border) from their current height to zero, then set’s display to none and resets the height, opacity, etc.
showSets the display of the element to opacity: 0 and display: block, then transitions the height, opacity, padding, and margin (but not border) from zero to their proper height.
toggleToggles the element from shown to hidden.
ElementAdds Fx.SmoothShow shortcuts to the Element class.
Properties
smoothShowCreates a new instance of Fx.SmoothShow and calls its show method.
smoothHideCreates a new instance of Fx.SmoothShow and calls its hide method.
Change Log$Source: /cvs/main/flatfile/html/rb/js/global/cnet.global.framework/mootools.extended/Effects/Fx.SmoothShow.js,v $ $Log: Fx.SmoothShow.js,v $ Revision 1.7 2007/06/12 20:46:21 newtona added tbody to html.table.js added legacy argument support to Fx.SmoothShow

Fx. SmoothShow

Transitions the height, opacity, padding, and margin (but not border) from and to their current height from and to zero, then set’s display to none or block and resets the height, opacity, etc. back to their original values.

Arguments

optionsa key/value object of options

Options

all the options passed along to Fx.Base (transition, duration, etc.); (optional); PLUS

styles(array; optional) css properties to transition in addition to width/height; defaults to [‘padding’,’border’,’margin’]
mode(string; optional) ‘vertical’,’horizontal’, or ‘both’ to describe how the element should slide in. defaults to ‘vertical’
heightOverride(integer; optional) height to open to; overrides the default offsetheight
widthOverride(integer; optional) width to open to; overrides the default offsetwidth
Summary
Properties
hideTransitions the height, opacity, padding, and margin (but not border) from their current height to zero, then set’s display to none and resets the height, opacity, etc.
showSets the display of the element to opacity: 0 and display: block, then transitions the height, opacity, padding, and margin (but not border) from zero to their proper height.
toggleToggles the element from shown to hidden.

Properties

hide

Transitions the height, opacity, padding, and margin (but not border) from their current height to zero, then set’s display to none and resets the height, opacity, etc. back to their original values.

show

Sets the display of the element to opacity: 0 and display: block, then transitions the height, opacity, padding, and margin (but not border) from zero to their proper height.

toggle

Toggles the element from shown to hidden.

Element

Adds Fx.SmoothShow shortcuts to the Element class.

Summary
Properties
smoothShowCreates a new instance of Fx.SmoothShow and calls its show method.
smoothHideCreates a new instance of Fx.SmoothShow and calls its hide method.

Properties

smoothShow

Creates a new instance of Fx.SmoothShow and calls its show method.  Returns the instance of Fx.SmoothShow.

Arguments

optionssee Fx.SmoothShow options.

smoothHide

Creates a new instance of Fx.SmoothShow and calls its hide method.  Returns the instance of Fx.SmoothShow.

Arguments

optionssee Fx.SmoothShow options.

Change Log

$Source: /cvs/main/flatfile/html/rb/js/global/cnet.global.framework/mootools.extended/Effects/Fx.SmoothShow.js,v $ $Log: Fx.SmoothShow.js,v $ Revision 1.7 2007/06/12 20:46:21 newtona added tbody to html.table.js added legacy argument support to Fx.SmoothShow

Revision 1.6 2007/05/31 23:57:49 newtona slight tweak to last checkin

Revision 1.5 2007/05/31 23:55:30 newtona chaining now works properly; added logic to handle double-click behavior

Revision 1.4 2007/05/31 21:33:42 newtona .toggle returns the effect

Revision 1.3 2007/05/30 20:32:33 newtona doc updates

Revision 1.2 2007/05/29 22:46:19 newtona syntax fix in Fx.SmoothShow; docs update, too.

Revision 1.1 2007/05/29 22:27:02 newtona rebuilt cat libs, added Fx.SmoothShow.js

Adds <Fx.SmoothShow> shortcuts to the Element class.
Transitions the height, opacity, padding, and margin (but not border) from and to their current height from and to zero, then set’s display to none or block and resets the height, opacity, etc.
My Object Oriented javascript.
Contains String prototypes and Number prototypes.
function $A(array,
start,
length)
returns a copy of the array.
Same as Array.copy, but as function.
function $each(iterable,
fn,
bind)
Use to iterate through iterables that are not regular arrays, such as builtin getElementsByTagName calls, arguments of a function, or an object.
Contains Array prototypes, $A, $each
Contains Function prototypes and utility functions .
function $(el)
returns the element passed in with all the Element prototypes applied.
Contains useful Element prototypes, to be used with the dollar function $.
Css Query related function and Element extensions
Base class for the Mootools Effects (Moo.Fx) library.