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