identifier
1. identifier is used to write down notes of animations, actions and anything we find important to make note of
identifier is a visual reference
2. identifier also provides a quick overview of the function structure flow
STRUCTURE: function (e) { javascript before - selector - [action before - manipulation method - action after] - (css) - javascript after }
selector
target an object by id (#) or class (.) or element
the full range on selectors is beyond the scope of this manual
for an in depth on selectors simplified see here
•••• var: string
position
set position for selector
•••• var: string
left
set left position for selector
•••• var: string
top
set top position for selector
•••• var: string
width
set width for selector
NOTE: setting this property to not used prevents code for this property from being generated
•••• var: string
height
set height for selector
NOTE: setting this property to not used prevents code for this property from being generated
•••• var: string
float
set float behavior for selector
•••• var: string
z-index | stack
set z-index for selector, the z-index | stack property can be used in 2 methods
NOTE: setting this property to not used prevents code for this property from being generated
IMPORTANT: the page property - use of z-index - in Webbuilder must be enabled to use the z-index property effectively
•••• var: string
overflow
set behavior of selector when content is passing it's border
•••• var: string
add action | before & add action | after
with add action, actions can be added before or after the manipulation method
by doing so we can further enhance our animation (or change actions)
for some practical use of these effects see here
NOTE: specific use here can be to change the flow of the function structure ie. target the parent( ) instead
•••• var: string
appendTo | selector
append, add to this selector ( ie. append to document body or to an object )
NOTE: the manipulation method can be changed with the property code modification | method see below
•••• var: string
run on load
run on load enables or disables this module to run on page load
run on call
run on call is the function name we can give this current function
we can call this function to occur ie. by using a callback | function
for an in depth on callback and run on call see here
code modification | method
change the manipulation method. (prepend or wrap etc)
WARNING: changes made here can change the function structure flow
code modification | variable
add function variables ie. Call_Append_1(myVariable)
this function is beyond the scope of this manual see here
code modification | javascript | after
add javascript, further enhancing this function by adding custom code
this function is beyond the scope of this manual see here
code modification | javascript | before
add javascript, further enhancing this function by adding custom code
this function is beyond the scope of this manual see here
__________________________________________________________________________
more info on module | appendTo see here Overview
METHOD 1
the z-index | stack property can be set by input of a number value, use this property as a way to dock objects
dock an object in front by giving it a high value (2000+)
dock an object in back by giving it a negative value (-1)
highly recommended: use the z-index | stack property only in this manner - as a docking method
NOTE:
for cross-browser compatibility a z-index of 0 can not be set, internally the module will convert a value of 0 to -1
this conversion can be surpassed by using b0 instead (advanced user only)
METHOD 2
the z-index | stack property can also be set by input of selector a target object
the target object z-index will be taken and transferred to the appended object
internally this method also automatically adjust for the above - z-index of 0 - issue
note that in this method the stacking occurs independent from the level each object may be positioned in
ie. an object that is appended to the body with a target of an object that is on a WB centered page
will position the appended object above or below all centered content
recommended: advanced user only
MODULE APPENDTO - PROPERTIES
TOOL