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)大?。?/p>
首先設(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)方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
編寫插件的目的是給已經(jīng)有的一系列方法或函數(shù)做一個(gè)封裝，以便在其他地方重復(fù)使用，提高開發(fā)效率和方便后期維護(hù)。本文將詳細(xì)介紹如何編寫jQuery插件2017-03-03
jQuery表單校驗(yàn)插件validator使用方法詳解
這篇文章主要為大家詳細(xì)介紹了jQuery表單校驗(yàn)插件validator的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-02-02
Jquery 一次處理多個(gè)ajax請(qǐng)求的代碼
Jquery 一次處理多個(gè)ajax請(qǐng)求的代碼，需要的朋友可以參考下。2011-09-09
Jquery選擇器分類：基本選擇器，層次選擇器，過濾選擇器，表單選擇器2012-05-05
qTip2是一個(gè)灰常強(qiáng)大且精致的jQuery提示信息插件，是qTip的第2版，也是一個(gè)全新的版本，提供了豐富的功能及漂亮的外觀，非常易于使用2012-02-02
JQuery 拾色器插件發(fā)布-jquery.icolor.js
web項(xiàng)目中不少地方需要用到顏色選擇器，比如設(shè)置某個(gè)元素的背景色、邊框色等等，按照我們交互設(shè)計(jì)的期望-設(shè)色器最好簡(jiǎn)單易用，僅顯示常用的那些色塊給用戶選擇，另外提供一個(gè)輸入框方便用戶輸入自定義的色值。2010-10-10
使用jQuery實(shí)現(xiàn)input數(shù)值增量和減量的方法
這篇文章主要介紹了使用jQuery實(shí)現(xiàn)input數(shù)值增量和減量的方法,實(shí)例分析了Bootstrap TouchSpin插件的用法,是非常實(shí)用的技巧,需要的朋友可以參考下2015-01-01
淺談Jquery中Ajax異步請(qǐng)求中的async參數(shù)的作用
下面小編就為大家?guī)硪黄獪\談Jquery中Ajax異步請(qǐng)求中的async參數(shù)的作用。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-06-06
AJAX 流行之后，總想好好學(xué)習(xí)一下。但是眾多的框架實(shí)在難以選擇。說明一下 ASP.NET AJAX 并不包括在 AJAX 框架之中。2009-11-11
jQuery實(shí)現(xiàn)可拖動(dòng)進(jìn)度條實(shí)例代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)可拖動(dòng)進(jìn)度條實(shí)例代碼，非常不錯(cuò)，具有參考借鑒價(jià)值,需要的朋友可以參考下2017-06-06