One of the trends that I notice in web design is the paper folding effect. Here in this post I am going to give you few resources that will surely inspire you to achieve paper folding effect in web development.
Fold It 3D Menu
jQuery plugin for animated 3D menu. Panel menu for mobile sites/phonegap and full site that features a distinctive 3d perspective accordeon effect . This menu can be the basis of either a mobile web site or packaged as a hybrid app using phonegap.
PFold is a very experimental jQuery plugin that makes it possible to open elements in a paper-like unfolding effect. An element can be unfolded in 3D in order to reveal some other content. The idea is to have several levels of folding, where each step of opening will double the element size, hence imitating a folded paper being opened.
The plugin takes a dom element, slices it into parts and arranges them like a folded paper in 3d space.
Foldup.js lets you create a “fold up” effect for text on your website. As users resize their browsers, the text folds up in a 3D effect.
Basically the effect works by slicing up a chunk of content and animating the height and rotation of each slice independently. Each slice has multiple wrappers that control the vertical offset of the content relative to that slice. Overall the code isn’t that complex and it only took a touch of math (some basic trig to get the correct wrapper height based on the rotation angle). The browser does almost everything for you.
An experimental CSS 3D dropdown concept, wrapped up in a jQuery plugin.
The Sexy Curls jQuery Plugin
The Sexy Curls jQuery Plugin is an open-source jQuery plugin by Elliott Kember which lets you share in the beauty of the page fold.