轻松修改TreePanel 的图标样式和背景图片

最新推荐文章于 2020-12-18 18:39:34 发布

原创最新推荐文章于 2020-12-18 18:39:34 发布 · 388 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#CSS #EXT #JavaScript #ViewUI

Ext 专栏收录该内容

20 篇文章

订阅专栏

本文介绍了一种通过CSS为树形结构的不同节点状态定义图标的方法，并展示了如何设置TreePanel的背景图片。

给树形结构定义图标的css


.x-tree-node-collapsed .x-tree-node-icon{background-image:url(/foreigns/back/img/icon/book.png);}
.x-tree-node-expanded .x-tree-node-icon{background-image:url(/foreigns/back/img/icon/book_open.png);}
.x-tree-node-leaf .x-tree-node-icon{background-image:url(/foreigns/back/img/icon/page_white.png);}

加一个背景图片


var tree = new Ext.tree.TreePanel({
		bodyStyle:'background:url(/foreigns/back/img/logo/bgb.jpg) repeat;', 
		baseCls:'bgimage',
		border:false,
		root:root,
		loader:loader,
		rootVisible:false
	});