file-explore是一款简单的jquery目录树插件。它使用嵌套的无序列表作为目录树的结构，结合font-awesome图标可以制作出非常漂亮的jquery目录树效果。

使用方法

在页面中引入file-explore.css和font-awesome文件，以及jquery和file-explore.js文件。

HTML结构

该目录树使用嵌套的无序列表作为目录树的结构，一个目录树的HTML结构如下：

    
收藏夹
    

        
文档 
          

              
图片
                

                    
 Link 5 
                    
 Link 6 
                    
 Link 7 
                    
 Link 8 
                    
 Deeper
                      

                          
Link 1 
                          
Link 2 
                          
Link 3 
                          
Link 4 
                        
                    
                
              
              
视频
                

                    
 Link 5 
                    
 Link 6 
                    
 Link 7 
                    
 Link 8 
                    
 Deeper
                      

                          
Link 1 
                          
Link 2 
                          
Link 3 
                          
Link 4 
                        
                    
                
              

          
        
        
        
Link 2 
        
Link 3 
        
Link 4 
      
    
    
音乐
    

        
Link 1 
        
Link 2 
        
Link 3 
        
Link 4 
      
  

                

初始化插件

在页面DOM元素加载完毕之后，可以通过filetree()方法来对目录树进行初始化。

$(document).ready(function() {
  $(".file-tree").filetree();
});                
                

配置参数

该jquery目录树插件有2个可用的配置参数：

第一个参数可以设置是否快速显示下级目录：

$(document).ready(function() {
  $(".file-tree").filetree({
    animationSpeed: 'fast'
  });
});               
                

第二个参数是否在目录树初始化时收缩所有的树节点。

$(document).ready(function() {
  $(".file-tree").filetree({
    collapsed: true,
  });
});             
                

该jquery目录树的github地址为：https://github.com/GraphicDesignElite/file-tree