Mac-OSX-Like Animated Folder Efffect

Mac-OSX-Like Animated Folder Efffect using CSS3 3D transforms, gradients and box shadows. 

How to Use It:

1. CSS

<!-- The jQuery UI Styles -->
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
        
<!-- Our stylesheet -->
<link rel="stylesheet" href="assets/css/styles.css" />

2. HTML

<div id="main">
<div class="folder">
<div class="front"></div>
<div class="back"></div>
</div>
<img src="assets/48px/box.png" style="top:340px;left:100px;" alt="box" /> 
<img src="assets/48px/calculator.png" style="top:340px;left:170px;" alt="calculator" /> 
<img src="assets/48px/clipboard.png" style="top:340px;left:240px;" alt="clipboard" /> 
<img src="assets/48px/console.png" style="top:340px;left:310px;" alt="console" /> 
<img src="assets/48px/basketball.png" style="top:340px;left:380px;" alt="basketball" /> 
<img src="assets/48px/facebook.png" style="top:400px;left:100px;" alt="facebook" /> 
<img src="assets/48px/gift.png" style="top:400px;left:170px;" alt="gift" /> 
<img src="assets/48px/id_card.png" style="top:400px;left:240px;" alt="id card" /> 
<img src="assets/48px/imac.png" style="top:400px;left:310px;" alt="imac" /> 
<img src="assets/48px/system_monitoring.png" style="top:400px;left:380px;" alt="system monitoring" /> 
</div>

3. Include jQuery Library, jQuery UI and script.js

<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> 
<script src="assets/js/script.js"></script>

---

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