jQuery EasyUI Window -Окно и макет
Компонент Layout можно встроить в окно. Мы можем создать окно со сложным макетом, даже не написав ни одной строки кода JavaScript. Фреймворк jQuery EasyUI выполняет рендеринг и изменение размеров в фоновом режиме за нас.
В качестве примера мы создаём окно, содержащее две части: одну слева, а другую справа. В левой части окна мы создаём дерево; в правой части окна мы создаём контейнер вкладок.
<div class="easyui-window" title="Layout Window" icon="icon-help" style="width:500px;height:250px;padding:5px;background: #FAFAFA;"> <div class="easyui-layout" fit="true"> <div region="west" split="true" style="width:120px;"> <ul class="easyui-tree"> <li> <span>Library</span> <ul> <li><span>easyui</span></li> <li><span>Music</span></li> <li><span>Picture</span></li> <li><span>Database</span></li> </ul> </li> </ul> </div> <div region="center" border="false" border="false"> <div class="easyui-tabs" fit="true"> <div title="Home" style="padding:10px;"> jQuery easyui framework help you build your web page easily. </div> <div title="Contacts"> No contact data. </div> </div> </div> <div region="south" border="false" style="text-align:right;height:30px;line-height:30px;"> <a class="easyui-linkbutton" icon="icon-ok" href="#">Ok</a> <a class="easyui-linkbutton" icon="icon-cancel" href="#">Cancel</a> </div> </div> </div>
Посмотрите на код выше — мы использовали только HTML-разметку, и будет отображено сложное окно макета. Это фреймворк jQuery EasyUI: простой и мощный.
Скачать примеры jQuery EasyUI
jeasyui-win-win3.zip
Другие расширения