We often come to a situation where we need to give awesome flip/book page effect to our HTML pages and make them look like real magazines and books.
Recently, I have studied a library named Turn.js (http://www.turnjs.com/). This can make beautiful flip effects on the pages based on simple HTML.
It will make your content look like a real book or magazine using all the advantages of HTML5. It is a light weighted library (10Kb) with simple and clean API.
All you need to do is to provide a container and pass an ID to an HTML tag and you are good to go. All the elements (div, span, h1) in the container will become pages and your magazine/book is ready.
You can find the working Code here.
Below are the steps to achieve
Step 1 :- Install the dependencies — We have to include the jQuery.
Step 2 :- Add the HTML
Step 4 — Add the CSS
Conclusion — Turn.js is a fantastic library to create the flip effect using HTML sections. Although it provide the various features that may be hard to implement but it comes with a dependency of jQuery.
Apart from this, it is must try library for various use cases like news, magazines and other publication portals.