Turn.js – Get Page Flip Effect in HTML5

Dec 7, 2012

Looking for a free pageflip solution? Want to add page flipping or page turning effect on your website, but without flash? If yes, give Turn.js a try. The Turn.js is a jQuery plugin, which will let you create nice page flip effect in HTML5. It utilizes jQuery & HTML5 canvasĀ to give you transition effects similar to pages in a real book or magazine.

Sometimes the content or theme of a website demands that you use a book-like interface with page turning effect (pageflip). For example, a book website or an online magazine. All popular page flip solutions are flash-based. But one can also create page flipping effect by using JavaScript. If you don’t want flash, you may go for a JS based solution to meet your requirements. In that case JavaScript libraries like Turn.js comes handy.

Turn.js Flipping Book

Lightweight & Powerful:

Turn.js is lightweight (10KB) and comes with a powerful API. Use and customization is easy. There are many options, methods, events, properties and CSS classes. Moreover, it will let you use Ajax requests to load page content dynamically. Additional features available with this HTML5 pageflip solution include Zoom viewport and ability to cut a page into two parts (Scissors).

What about compatibility? Turn.js supports Firefox 10, Chrome 12, Safari 5 and Internet Explorer 9. It works smoothly on iPhone, iPad and Android devices. There is also an HTML4 version of Turn.js, which makes it compatible with old web browsers like Internet Explorer 8.

Download Turn.js:

https://github.com/blasten/turn.js

Leave a Reply

Note: The sign * means required field. Comments are subject to moderation.