Folding Up The DOM Element Like Paper with jQuery oriDomi Plugin

oriDomi is a javascript library that allows you to create a animation which can Folds Up the DOM Like Paper Folding.

You might also like:

• Mac-OSX-Like Animated Folder Efffect
• Paperfold CSS - Fold Elements Like Paper
• 3D Thumbnail Paper Folding Effect
• Paper Like Unfolding Effect Plugin

Features:

• zero dependencies
• less than 15k
• optional jQuery support
• works on iOS
• built in touch handlers with callbacks

Basic Usage:

1. The HTML

<div class="demo demo2">jQuery Scirpt</div>

2. Include oriDomi.js on your web page

<script src="oridomi.js"></script> 

3. The javascript

(function(){

function init(){
    var demo2 = document.getElementsByClassName('demo2')[0],
        domi2 = new OriDomi(demo2, { hPanels: 1, vPanels: 3 }),
        foldMe = document.querySelector('.fold-me > p'),
        foldDomi = new OriDomi(foldMe, { vPanels: 1, hPanels: 4, perspective: 200, speed: 500 });

    foldMe.addEventListener('mouseover', function(){
        foldDomi.accordion(-40, 1);
    }, false);

    foldMe.addEventListener('mouseout', function(){
        foldDomi.reset();
    }, false);


    setTimeout(function(){
        domi2.reveal(40);
    }, 3000);

}

document.addEventListener('DOMContentLoaded', init, false);

})();

4. The CSS

.demo2 {
font-family: "Abril Fatface", "Hoefler Text", Constantia, Palatino, Georgia, serif;
font-size: 4.5rem;
width: 25rem;
height: 10rem;
text-align: center;
line-height: 1;
color: #ff676d;
background-color: #6ac1ff;
padding: 2.5rem 0;
}

Changelog:

v1.1.5 (2016-02-08)

• rebuild

v1.1.5 (2014-09-17)

• updated to the latest version.

v1.1.3 (2014-08-15)

• updated to the latest version.

v1.1.2 (2014-07-21)

• updated to the latest version.

v1.1.1 (2014-06-24)

• updated to the latest version.

v1.1.0 (2014-02-18)

• updated to the latest version.

v1.0.4 (2013-12-05)

• updated to the latest version.

v1.0.2 (2013-11-21)

• updated to the latest version.

v1.0.0 (2013-11-4)

• fix for flaky mouse events

---

This awesome jQuery plugin is developed by dmotz. For more Advanced Usages, please check the demo page or visit the official website.