# css_page_flip

**Repository Path**: sheyanjia/css_page_flip

## Basic Information

- **Project Name**: css_page_flip
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-08-13
- **Last Updated**: 2024-08-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

h1. CSS Page Flip: a CSS and JS 3D Page Flipper

*Version 0.2 (Jan 2010)*

This is an open source pure CSS and Javascript 3D Page Flipping framework (which requires jQuery)

h2. What does this do?

It converts this:

<pre><code>
<ol id="foo">
	<li>Page 1</li>
	<li>Page 2</li>
	<li>Page 3</li>
</ol>
</code></pre>

Into a page flippable layout using pure CSS3 animations. Currently works in Safari and iPhone.

Example in action:  "http://jamesyu.org/css_page_flip/examples/example.html":http://jamesyu.org/css_page_flip/examples/example.html
Download the source here: "http://jamesyu.org/css_page_flip/lib/css_page_flip.js":http://jamesyu.org/css_page_flip/lib/css_page_flip.js

h2. Usage

Simply include all source files under lib, and (for the example above) call:

<pre><code>
	CSSPageFlip.init('foo');
</code></pre>
	
You can apply your own styles to each page by targeting "ol li .page". CSSPageFlip
will set the size of the flipping UI to fill the space in the containing element.

See the examples directory for more usage details.

h2. TODO

* AJAX fetching for more pages
* Better animations
* Optional controls, zooming, and other goodness