Option: autoCenter: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
(5 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
Centers the flipbook depending on how many pages are visible. The <tt>autoCenter</tt> option changes the CSS <tt>margin-left<tt | Centers the flipbook depending on how many pages are visible. The <tt>autoCenter</tt> option changes the CSS <tt>margin-left</tt> property of the flipbook. | ||
{| class="wikitable" | {| class="wikitable" | ||
|- | |- | ||
! scope="row | ! scope="row" | Type | ||
! scope="row" | Default value | |||
|- | |||
! scope="row | | Boolean | ||
| false | | false | ||
|} | |} | ||
<yambe:breadcrumb>Options</yambe:breadcrumb> | ==Adding animation== | ||
It's just as simple as adding a transition to the <tt>margin-left</tt> property. | |||
<pre class="css"> | |||
#flipbook{ | |||
-webkit-transition:margin-left 0.2s ease-in-out; | |||
-moz-transition:margin-left 0.2s ease-in-out; | |||
-o-transition:margin-left 0.2s ease-in-out; | |||
-ms-transition:margin-left 0.2s ease-in-out; | |||
transition:margin-left 0.2s ease-in-out; | |||
} | |||
</pre> | |||
<yambe:breadcrumb>Turn Options</yambe:breadcrumb> |
Latest revision as of 06:25, 26 November 2012
Centers the flipbook depending on how many pages are visible. The autoCenter option changes the CSS margin-left property of the flipbook.
Type | Default value |
---|---|
Boolean | false |
Adding animation
It's just as simple as adding a transition to the margin-left property.
#flipbook{ -webkit-transition:margin-left 0.2s ease-in-out; -moz-transition:margin-left 0.2s ease-in-out; -o-transition:margin-left 0.2s ease-in-out; -ms-transition:margin-left 0.2s ease-in-out; transition:margin-left 0.2s ease-in-out; }
<yambe:breadcrumb>Turn Options</yambe:breadcrumb>