您的位置首页生活百科

jQuery EasyUI从入门到精通(10)

jQuery EasyUI从入门到精通(10)

的有关信息介绍如下:

jQuery EasyUI从入门到精通(10)

jQuery EasyUI是一组基于jQuery的UI插件集合体,而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript,也不需要对css样式有深入的了解,开发者需要了解的只有一些简单的html标签。

本经验是 【jQuery EasyUI从入门到精通】系列教程的第10部分,在第9部分的基础上继续讲述 jQuery EasyUI Web Demos之Layout(布局)。

第9部分已经讲述了Basic(基础布局)、Add and Remove Layout(添加和移除布局)、Complex Layout(复杂布局)。

第10部分继续讲述Nested Layout(嵌套布局)、No collapsible button(没有折叠按钮的布局)、Auto Height(自适应高度布局)、Fluid Layout(流式布局)。

Nested Layout(嵌套布局),The layout region panel contains another layout or other components(这种布局区域面板包含另一个布局或者其它组件).

Nested Layout - jQuery EasyUI Demo

Nested Layout

The layout region panel contains another layout or other components.

Nested Layout(嵌套布局),运行效果如下图所示。

No collapsible button in Layout(没有折叠按钮的布局),The layout region panel has no collapsible button.

No collapsible button in Layout - jQuery EasyUI Demo

No collapsible button in Layout

The layout region panel has no collapsible button.

No collapsible button in Layout(没有折叠按钮的布局),运行效果如下图所示。

Auto Height for Layout(自适应高度布局),This example shows how to auto adjust layout height after dynamically adding items.

Auto Height for Layout - jQuery EasyUI Demo

Auto Height for Layout

This example shows how to auto adjust layout height after dynamically adding items.

Panel Content.

Panel Content.

Panel Content.

Panel Content.

Panel Content.

Auto Height for Layout(自适应高度布局),运行效果如下图所示。

Fluid Layout(流式布局),Percentage width of region panel in a layout.

Fluid Layout - jQuery EasyUI Demo

Fluid Layout

Percentage width of region panel in a layout.

width: 30%

Fluid Layout(流式布局),运行效果如下图所示。