JQuery EasyUI Layout 在from布局自適應(yīng)窗口大小的實(shí)現(xiàn)方法
在jQuery EasyUI中，如果直接在form上布局時(shí)當(dāng)窗口大小調(diào)整布局不會(huì)改變，將布局應(yīng)用于body時(shí)中間隔著一個(gè)form，橫豎不好弄。
網(wǎng)上有多個(gè)解決方案，一般都是寫代碼，在窗口大小改變時(shí)設(shè)置布局。
經(jīng)實(shí)驗(yàn)，新版本的JQuery EasyUI中布局可以采用以下方式來達(dá)到自動(dòng)適應(yīng)大小：
首先設(shè)置樣式，使html和body高度為100%（因form和div高度設(shè)置為100%需要繼承上級(jí)）：
<style type="text/css">
html,body
{
height:100%;
margin:0 auto;
}
</style>
然后頁面代碼如下：
<body class="easyui-layout"> <form id="form1" runat="server" style="height:100%; border:green 0px solid;" region="center"> <div style="padding-left:30px; height:40px;" region="north">北</div> <div region="center">中間</div> <div region="west" style="width:30px;">West</div> <div region="east" style="width:40px;">East</div> </form> </body>
效果1，小窗口：
效果2，調(diào)整大小后：
可以看到布局會(huì)自動(dòng)適應(yīng)大小了
備注：測(cè)試JQuery EasyUI版本從1.3.1可以，1.2.6不可以，中間的沒有試過
以上這篇JQuery EasyUI Layout 在from布局自適應(yīng)窗口大小的實(shí)現(xiàn)方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
jQuery插件formValidator自定義函數(shù)擴(kuò)展功能實(shí)例詳解
這篇文章主要介紹了jQuery插件formValidator自定義函數(shù)擴(kuò)展功能,結(jié)合實(shí)例形式分析了jQuery插件formValidator常見的各種判定與驗(yàn)證技巧,非常簡單實(shí)用,需要的朋友可以參考下2015-11-11
jQuery Ajax方法調(diào)用 Asp.Net WebService 的詳細(xì)實(shí)例代碼
我在這里將jQuery Ajax 調(diào)用Aspx.Net WebService 的幾個(gè)常用的方法做了一個(gè)整理，提供給正在找這方面內(nèi)容的博友，希望能給學(xué)習(xí)jQuery的朋友一點(diǎn)幫助，可以直接復(fù)制代碼運(yùn)行。2011-04-04
本文主要對(duì)jquery判斷頁面網(wǎng)址是否有效的兩種方法：jQuery方法；AJAX XMLHTTP方法；需要的朋友可以參考借鑒下2016-12-12
each()函數(shù)是基本上所有的框架都提供了的一個(gè)工具類函數(shù)，通過它，你可以遍歷對(duì)象、數(shù)組的屬性值并進(jìn)行處理，jQuery和jQuery對(duì)象都實(shí)現(xiàn)了該方法，下面是使用方法2014-03-03
jQuery實(shí)用密碼強(qiáng)度檢測(cè)
本篇文章主要介紹了jQuery實(shí)用密碼強(qiáng)度檢測(cè)，這是一個(gè)非常常見的功能，可以驗(yàn)證密碼的強(qiáng)度，本文使用jQuery來實(shí)現(xiàn)，有需要的小伙伴可以參考下。2017-03-03
這篇文章主要介紹了高效jQuery選擇器的5個(gè)技巧,結(jié)合實(shí)例形式總結(jié)分析了jquery選擇器使用過程中發(fā)的各種常用技巧,需要的朋友可以參考下2019-11-11
jquery獲取并修改觸發(fā)事件的DOM元素示例【基于target 屬性】
這篇文章主要介紹了jquery獲取并修改觸發(fā)事件的DOM元素,結(jié)合實(shí)例形式分析了jQuery基于target 屬性獲取到觸發(fā)該事件的dom并修改的相關(guān)操作技巧,需要的朋友可以參考下2019-10-10
jQuery的選擇器非常強(qiáng)大,使你可以輕松選取頁面中任何一個(gè)對(duì)象,下面我們就主要針對(duì)DOM操作來看一下jQuery中選擇器的基礎(chǔ)使用教程,需要的朋友可以參考下2016-05-05
jQuery插件zTree實(shí)現(xiàn)的基本樹與節(jié)點(diǎn)獲取操作示例
這篇文章主要介紹了jQuery插件zTree實(shí)現(xiàn)的基本樹與節(jié)點(diǎn)獲取操作,結(jié)合實(shí)例形式分析了jQuery樹形插件zTree構(gòu)造基本樹與針對(duì)節(jié)點(diǎn)的獲取操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-03-03
這篇文章主要介紹了jQuery中append()方法用法,實(shí)例分析了append()方法的功能、定義及在匹配元素的結(jié)尾插入指定內(nèi)容的使用技巧,需要的朋友可以參考下2015-01-01