controllerPopRot
popRot(duration, rotation, far_z,
affect, register_actions)
popRot.messages = [show, show_immediately, hide, hide_immediately]
popRot.events = [show_start, show_end, hide_start, hide_end]
Description
Performs a transition of the element from its current position (the shown state) to a position far away (in positive or negative direction) on the Z axis (the hidden state), and backwards to the shown state.
Apart from moving on the Z axis, the element is also rotated around its Y axis and its opacity is decreased to zero on the way to the hidden state.
The amount of rotation is controlled via the rotation
param,
the Z position of the hidden state - via the far_z
param.
This controller instantiates a move(), a rotate() and a opacity() controllers which perform the transitions on the respective properties.
The instantiated sub-controllers apply one translate
and one rotate
transform.
Parameters
Visit page Controller # Common Parameters for documentation on the parameters, common to all controllers:
id
,
paused
and
disabled
.
Parameters of popRot()
:
- duration
- Duration of the animation (forward or backward) in milliseconds. Default value: 700
- rotation
-
Amount of rotation around axis Y, in degrees, of the forward transition (from the shown to the hidden state).
Negative values result in rotation in the opisite direction.
Supply a value of
0
for no rotation (onlytranslate
andopacity
transitions). Default value: -720 - far_z
- Z coordinate, in pixels, of the hidden state. Can have a positive value (for disappearing towards the camera), or a negative value (for disappearing in the far distance). Default value: -500%
- affect
-
Whether the opacity animation should change the element's
style.display
orstyle.visibility
properties when the element reaches its 'hidden' state.
Possible values:""
-style.display
andstyle.visibility
are not affected,"display"
-style.display
is set to"none"
when the element's opacity reaches0
, and then back to its original value when the element's opacity becomes different than0
,"visibility"
-style.visibility
is set to"hidden"
when the element's opacity reaches0
, and then back to"visible"
when the element's opacity becomes different than0
.
- register_actions
-
Tells whether to handle the element's
show
,hide
,show_immediately
andhide_immediately
actions.
Values:false
/true
/"500"
(i.e. react with 500 milliseconds delay) /"500 elm"
(i.e. set event handlers with delay 500ms for HTML element #elm's actions). Default value: false
Accepted Messages
Visit page Controller # Common Messages for documentation on the messages, accepted by all controllers:
pause
,
unpause
,
enable
,
disable
,
params
and
remove
.
Messages specific to popRot()
:
- show
- Start transitioning towards the shown state of the controller. This message has no effect if the controller is already performing such a transition or is in the shown state. Message params: none
- show_immediately
- Immediately position the controller into its shown state and transform the element respectively. This message has no effect if the controller is already in the shown state. Message params: none
- hide
- Start transitioning towards the hidden state of the controller. This message has no effect if the controller is already performing such a transition or is in the hidden state. Message params: none
- hide_immediately
- Immediately position the controller into its hidden state and transform the element respectively. This message has no effect if the controller is already in the hidden state. Message params: none
Generated Events
Visit page Controller # Common Events for documentation on the events, generated by all controllers:
frame
,
remove
,
paused
,
unpaused
enabled
and
disabled
.
Events fired by popRot()
:
- show_start
- Fired upon the start of a transition towards the shown state. Event params: none
- show_end
- Fired upon the end of a transition towards the shown state. Event params: none
- hide_start
- Fired upon the start of a transition towards the hidden state. Event params: none
- hide_end
- Fired upon the end of a transition towards the hidden state. Event params: none
Interaction with DOM
- Transforms: Applies one
translate
and onerotate
transform. - CSS: Works with any styling. Modifies the element's
style.opacity
property. - Events: Does not set event listeners.
Changes Log
- Controller introduced in v.0.80