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

DOM Element

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 (only translate and opacity 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 or style.visibility properties when the element reaches its 'hidden' state.
Possible values:
  • "" - style.display and style.visibility are not affected,
  • "display" - style.display is set to "none" when the element's opacity reaches 0, and then back to its original value when the element's opacity becomes different than 0,
  • "visibility" - style.visibility is set to "hidden" when the element's opacity reaches 0, and then back to "visible" when the element's opacity becomes different than 0.
Default value: ""
register_actions
Tells whether to handle the element's show, hide, show_immediately and hide_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

Changes Log

  1. Controller introduced in v.0.80

See Also