How the FlipCard widget flips from the frontPanel to the backPanel is dictated by the animation option. There are several attributes of the animation option that you can change.
The default value is false, so that you need no extra code to use the flip animation. Set this attribute to true to just show the reverse side of the card with no animation effects.
The default value is "flip," and you can use any of the following jQuery UI animation effects in this attribute. See Animation for more details.
|
|
The default value is 500 miliseconds, but you can change the amount of time that you want the flipping action to take with this attribute.
The default value of "horizontal" flips the card side to side. Set this option to "vertical" to flip the card bottom to top instead. Flip the Card Vertically shows this attribute in action.
The example script below changes the duration to two seconds, the direction to vertical, and the type of action to shake.
Script to initialize the widget and change the animation |
Copy Code |
---|---|
<script id="scriptInit" type="text/javascript"> $(document).ready(function () { $("#flipcard1").wijflipcard({ animation: { duration: 2000, direction: "vertical", type: "shake" } }); }); </script> |