一个帮助你生成iOS文件夹效果的jQuery插件 - App-Folders

日期：2012-12-22 来源：GBin1.com



如果你是iOS的狂热分子的话，对于iOS风格app目录肯定非常熟悉，今天这里我们介绍一个实现iOS
app风格目录的jQuery插件：App-Folders

相关阅读：

使用jQuery开发iOS风格的页面导航菜单

这个插件同时支持桌面和Mobile应用，所以你可以创建俩种不同的样式，如下：



或者是移动设备的效果，如下：

HTML代码

<!--This is what you call in the function above-->
<div class="app-folders-container">

<!-- jaf-row 1 (You can have as many rows as you like) -->
<div class="jaf-container jaf-row">

<!--You can have as many folders as you like-->
<!--Folder's ID must match Class of the item that it opens-->
<div class="folder" id="uno">

<!--Anything wrapped by this link can open the content on click.-->
<a href="#">
<p>Folder 1</p>
</a>
</div><!--End Folder-->
</div><!--End Row-->

<!--Now, include the content that you want to show for each Folder-->

<!-- CLASS must equal the ID of the item that calls it.-->
<div class="uno folderContent">
<div class="jaf-container">

<!--Add whatever HTML you want in this area-->
<p>Content for folder one.</p>

</div>
</div><!-- End folderContent uno-->

</div><!--End app-folders-container-->

Javascript代码

$(function() {
$('.app-folders-container').appFolders();
});

实现是不是非常简单，如果你希望使用这种超酷的展示目录的方式，赶快下载吧！

来源：一个帮助你生成iOS文件夹效果的jQuery插件 - App-Folders