Easyui 定製window視窗

2021-07-06 05:21:38 字數 1129 閱讀 2600

jquery easyui 是一種基於jquery的使用者介面外掛程式集合,在實際的開發種給我們帶來了很大的便利,方便資料的直觀展示等。

在實際的開發中,我們要使用easyui就需要先導入easyui的jar包。

easyui預設的樣式是這樣子的

但是在實際的開發中有時候需要定製自己專案使用的easyui ,那麼我們就需要對easyui的樣式進行相應的修改

比如,我們的目標是從左圖到右圖:

我們需要如下的定義:

.window 

.window .window-header

.window .window-body

.window .window-body-noheader

.window .window-header .panel-icon,

.window .window-header .panel-tool

.panel-tool-min

.window .window-header .panel-title

/* .window .window-header .panel-tool a */

/* 定製accordion */

.accordion

.accordion .accordion-header

.accordion .accordion-header-selected

.accordion .accordion-header-selected .panel-title

/* 標示箭頭 */

.accordion-collapse

.accordion-expand

需要注意的是在index.html頁面引入css檔案的時候,要注意引入css檔案的順序,後面的樣式會覆蓋掉前面的樣式。

easyui 基礎元件 window

window 依賴下面三個元件,就是繼承,所以下面的特性和方法 事件都可以用 window 和panel不同之處,可以有拖拽移動draggable,拖改變大小reziable,預設都設定了上面4個工具欄為true 最大,最小,摺疊,關閉 modal特性,是否是模態,false時,可以點選 點選 為t...

easyUI 自定義window工具

author yhc 預設的window有四個工具 collapsible,minimizable,maximizable 和closable.如示例我們定義以下window 自定義工具,設定該工具為true或者false,如示例我們希望定義乙個window僅僅擁有乙個可關閉的工具,你應該設定任何其...

easyui的window外掛程式再次封裝

easyui的window外掛程式再次封裝 說明 該外掛程式彈出的彈出框在最頂層的頁面中,而不是在當前頁面所在的iframe中,它的可拖動範圍是整個瀏覽器視窗 所以不能用js的parent物件獲取彈出它的父頁面,這裡用了乙個笨方法,最多支援四級彈出框,即彈出框中再彈出彈出框的情況,笨方法也是方法,它...