background preloader

Page Flip jQuery

Facebook Twitter

BookBlock: A Content Flip Plugin. Turn.js - The page flip effect for HTML5. Amazing jQuery Notebook Page Flip Animation. Everyday jQuery is getting more and more popular because of it’s usefulness, flexibility and speed.

Amazing jQuery Notebook Page Flip Animation

This notebook animation style like “flash page layout” page flip animation is an excellent example of these competencies. This fancy jQuery Notebook skin uses a jQuery animation plugin called jQuery Booklet Plugin. Pro’s of the jQuery Notebook Animation Lightweight (only 17kb minified version)Easy to install with sliding divs for pagesVery smooth page flip animation and life like page effect View Demo How to Install Download the jQuery MoleSkine Notebook PackageAdd the HTML below (add a div with class “b-load” for each page)Edit the CSS styles to suit your needsEdit the Booklet JS options to tweak the page animaton jQuery Moleskine Package Includes: jQuery Booklet PluginAll images needed: photoshop file background, navigation images etc…jQuery 1.4.4.min.jsjQuery easing.1.3.jsCustom Fonts for pageHTML template example HTML Code <div id="loading" class="loading">Loading pages... The jFlip plugin. A flipping page gallery This plugin builds an image gallery made as a book.

The jFlip plugin

You can flip the book pages to view the next or previous image clicking or dragging the animated corners shown when hovering on the gallery area. By the way, no flash needed! Author: Renato Formato. Documentation The plugin needs jquery 1.2.3. IE needs a modified version of excanvas I wrote that supports patterns (with a special feature to scale patterns) and rotated linear gradient. You need to add the following line to the head: How to use the plugin The plugin finds all the images inside the provided selector and build the flipping book gallery.

$(selector).jFlip(width,height,options) Arguments Events - since version 0.4 The elements on which jFlip is applied can bind the flip.jflip event, triggered on page flip The event handler has the following signature: function(event,current_page,total_pages) Download Update v0.4 (28/2/2009): New options to change the corners color and size. ExcanvasX Demo. FlipPage: Tournez les pages sur votre iPad ! FlipPage est un plugin jQuery créant l'illusion de tourner les pages d'un livre.

FlipPage: Tournez les pages sur votre iPad !

Développé à l'origine pour une présentation sur tablette tactile, il peut aussi trouver sa place dans une application de livre électronique par exemple. Ce plugin a été développé en HTML5/CSS3 afin d'utiliser la puissance graphique hardware et de créer ainsi une animation plus fluide. Vous trouverez des exemples d'utilisation ci-après, et n'hésitez pas à me laisser vos impressions et vos suggestions ;) Navigateurs normalement compatibles: iPhone/iPad/iPod Touch - Android - Firefox 3.6+ - Chrome - IE 9 (sans animation) - IE 10 Navigateurs testés: iPhone 3G / iPhone 3GS / iPad 1 / iPad 2 - Android - Firefox 6 - Firefox 7 Beta - Safari - IE9 - IE10 Licence: LGPL v3 Sources: