原創|使用教程|編輯:龔雪|2015-11-05 09:09:04.000|閱讀 605 次
概述:在本教程中,你將學習到有關于easyui折疊面板的知識。折疊面板包含了一系列的面板,其中所有的面板標題都是可見的,但只有一個面板的主體內容在某個時間是可見的。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關鏈接:
Kendo UI for jQuery——創建現代Web應用程序的最完整UI庫!查看詳情>>>
在本教程中,你將學習到有關于easyui折疊面板的知識。折疊面板包含了一系列的面板,其中所有的面板標題都是可見的,但只有一個面板的主體內容在某個時間是可見的。當用戶點擊面板標題時,該面板的主體內容可見,其他面板的內容將會被隱藏。
我們將創建三個面板,其中第三個面板包含了一個樹形菜單。
<div class="easyui-accordion" style="width:300px;height:200px;"> <div title="About Accordion" iconCls="icon-ok" style="overflow:auto;padding:10px;"> <h3 style="color:#0099FF;">Accordion for jQuery</h3> <p>Accordion is a part of easyui framework for jQuery. It lets you define your accordion component on web page more easily.</p> </div> <div title="About easyui" iconCls="icon-reload" selected="true" style="padding:10px;"> easyui help you build your web page easily </div> <div title="Tree Menu"> <ul id="tt1" class="easyui-tree"> <li> <span>Folder1</span> <ul> <li> <span>Sub Folder 1</span> <ul> <li><span>File 11</span></li> <li><span>File 12</span></li> <li><span>File 13</span></li> </ul> </li> <li><span>File 2</span></li> <li><span>File 3</span></li> </ul> </li> <li><span>File2</span></li> </ul> </div> </div>
下載該EasyUI示例:
購買最新正版授權!""
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉載自:慧都控件網