tree 메뉴

힘들었다.....

남이 만들어놓은것 찾는것도, 그걸 맞게 고쳐 쓰는것도 참 일이구나..ㅠㅠ

.shuffle_menu ul{list-style-position:outside;}  
.shuffle_menu li{background-position:0 -176px; padding:3px 0 2px 16px; cursor:pointer;}  
.shuffle_menu span.folder {display:block; background:url(../images/folder.gif) no-repeat; padding: 0px 0 0px 20px;}  
.shuffle_menu span.file {display:block; background:url(../images/file.gif) no-repeat 0 1px; padding: 0px 0 0px 20px;}
.treeview, .treeview ul {padding: 0; margin: 0; list-style: none;}
.treeview ul {background-color:white; margin-top: 4px;}  
.expandable-hitarea{background:url(../images/icon_folder_minus.gif) no-repeat 0 2px;}  
.collapsable-hitarea{background:url(../images/icon_folder_plus.gif) no-repeat 0 2px;}
.treeview .hitarea {height: 16px; width: 16px; margin-left: -16px; float: left; cursor: pointer;}

<!-- shuffle_menu:str -->
    <div class="shuffle_menu">
     <ul id="tree">
      <li><span class="folder">Folder 1</span>
       <ul>
        <li><span class="file">File 1.1</span>
         <ul>
          <li><span class="file">File 1.1</span></li>
          <li><span class="file">File 1.2</span></li>
         </ul>
        </li>
        <li><span class="file">File 1.2</span></li>
       </ul>
      </li>
      <li><span class="folder">Folder 1</span>
       <ul>
        <li><span class="file">File 1.1</span></li>
        <li><span class="file">File 1.2</span></li>
       </ul>
      </li>
     </ul>
    </div>
    <!-- shuffle_menu:end -->

jquery.treeview.js