Class: .hard: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
Line 9: | Line 9: | ||
<div class="hard">Page 2</div> | <div class="hard">Page 2</div> | ||
</div> | </div> | ||
</pre> | |||
==Adding a feeling of depth== | |||
<pre class="css"> | |||
#bookshelf .page-wrapper{ | |||
-webkit-perspective:2000px; | |||
-moz-perspective: 2000px; | |||
-ms-perspective: 2000px; | |||
perspective: 2000px; | |||
} | |||
</pre> | </pre> | ||
Revision as of 04:38, 19 July 2012
Sets a hard transition effect for a page. By setting all the pages as hard you will create the same effect as in Flipboard.
Example:
<div id="flipbook"> <div class="hard">Page 1</div> <div class="hard">Page 2</div> </div>
Adding a feeling of depth
#bookshelf .page-wrapper{ -webkit-perspective:2000px; -moz-perspective: 2000px; -ms-perspective: 2000px; perspective: 2000px; }
See Also
<yambe:breadcrumb>Turn CSS</yambe:breadcrumb>