Class wink.ui.xyz.FlipDisc
The Flip Disc allows the user to browse a list of images. The user can rotate the first image to display the next or previous image, following the angle of rotation.
- Defined in: flipdisc.js
| Constructor Attributes | Constructor Name and Description |
|---|---|
|
wink.ui.xyz.FlipDisc(properties)
|
| Compatibility list | Supported platforms / browsers |
|---|---|
|
iOS2, iOS3, iOS4, iOS5, iOS6, Android 3.0, Android 3.1, Android 4.0, BlackBerry 7
|
Method Summary
Class Detail
wink.ui.xyz.FlipDisc(properties)
var properties = {
images: [ "./image1.png", "./image2.png" ],
offsetY: 30,
shiftY: 50
};
var flipdisc = new wink.ui.xyz.FlipDisc(properties);
container.appendChild(flipdisc.getDomNode());
- Parameters:
- properties
- Requires:
- wink.fx._xyz
- wink.fx._animation
- wink.ux.gesture
- See:
- Test page
Field Detail
{array}
images
The list of images of the flipdisc
{integer}
offsetY
The offset position on the y-axis
{integer}
shiftY
The shift between images
{integer}
uId
Unique identifier
Method Detail
-
{HTMLElement} getDomNode()
- Returns:
- {HTMLElement} The component main dom node
-
next()Displays the next image
-
previous()Displays the previous image
-
transform(params, transformations)Apply the given transformations to a node
- Parameters:
- {object} params
- object given by fx.animation call
- {HTMLElement} params.node
- The node to transform
- {array} transformations
- The list of transformations to apply
Event Detail
/flipdisc/events/click
Click on the first visible image
- Parameters:
- {object} param
- The parameters object
- {string} param.image
- The selected image name
- {intger} param.index
- The index of the selected image