實現Ext寬高自適應

2021-06-05 22:00:03 字數 663 閱讀 6435

不知是ext的bug還是其他原因,當初始化grid並將寬度設為100%時,其寬度會變成10000px寬,高度100%則grid高度根據grid內容自適應,而不是根據其所在容器自適應,一直沒有很好的辦法,只能使用絕對寬高,但有時這是很不方便的。

對此問題一直耿耿於懷,後來終於想出了乙個辦法,還真的可行,但就是感覺有點蹩腳。

一般我們都通過render到指定id的層上來展現grid,雖然不能讓grid寬高自適應,但層還是可以的。

如我們這裡要用到的層是

。我們可以在這個層上設定高寬。 如

。 則在初始化grid的時候讓其寬高與orggrid寬高相同即可,並在頁面resize時重新計算器寬度即可(一般高度固定還是比較好)。

js**如下:

//..前面若干行**省略,如ds/colmodel等

var orggrid=ext.get("orggrid");  //展示grid的容器

var grid = new ext.grid.gridpanel(

});

ds.load();

grid.render(orggrid);  //把grid鋪到id為grid的容器中

window.οnresize=function();

這樣不論頁面寬度怎麼變化grid都會自適應頁面容器了。 

寬高自適應

網頁布局中經常要定義元素的寬和高。但是很多時候我們希望元素的大小能夠根據視窗或子元素自動調整,這就是自適應 元素自適應在網頁布局中非常重要,他能夠使網頁顯示更加靈活,可以適應在不同裝置 不同視窗和不同解析度下顯示 1.寬度自適應 元素寬度設定為100 塊元素寬度預設為100 2.元素具備最小高度的自...

寬高自適應

寬高自適應 靈活 網頁布局中經常要定義元素的寬和高。但很多時候我們希望元素的大小能夠根據視窗或子元素自動調整,這就是pc自適應。自適應的優點 元素自適應在網頁布局中非常重要,它能夠使網頁顯示更靈活,可以適應在不同裝置 不同視窗和不同解析度下顯示。一 相對視窗和父元素的自適應寫法 寬度 width 1...

寬高自適應

寬高自適應可以使得網頁更加靈活,適應在不同的裝置不同解析度下。一 pc端寬高自適應 相對視窗或者父元素的自適應情況 寬度自適應 width 100 預設情況下,不新增定位時 寬度自適應的比例,是參照父元素的寬度進行顯示的,也就是說,如果元素的父元素是整個頁面的話,顯示的時候就是鋪滿整個螢幕 如果當父...