程序员人生 网站导航

ExtJs图片显示发现问题

栏目:jscript时间:2013-12-28 09:35:43

  年底收尾工作,任务也不是很多,空闲时间充裕,好久也没写些什么东西了,感觉自己都不存在这个世界里了,技术天天在更新,非要把我们这些搞技术的人学死、累死才行,看来还是要抽空写写文章,出去溜溜,娱乐一下,不然整个人都散架啦,现在可要学会工作、休闲两不误才行,才能跟上社会脚步~~~

  自己在空闲时间学习了 ExtJs 的用法, 利用VS2008做了个例子,顶部为标题,左侧是功能树,右侧是页面显示框架。但在做的过程中也发现了一个问题,就是左侧的 Panel 里的 Items,标题前面添加带图片的样式名称后,图片显示总是凹下去的效果,总感觉有个边框;在添加 tree 后,也发现展开节点后,节点前面默认的图片也是凹进去的,解决很久也没找到解决办法。

  效果如下:

  代码:

1 //添加左边
2 var west = new Ext.Panel({
3 //自动收缩按钮
4 collapsible: true,
5 border: false,
6 width: 225,
7 layout: "accordion",
8 extraCls: "roomtypegridbbar",
9 //添加动画效果
10 layoutConfig: {
11 animate: true
12 },
13 region: "west",
14 title: '通用管理系统(CMS)',
15 //
16 items: [{
17 title: "<b>菜单管理(Menu)</b>",
18 autoScroll: true,
19 iconCls: "hotelmanageicon",//样式名称 包含图片地址
20 items: [treenode] //创建树的函数
21 }, {
22 title: "<b>后台管理(Back-stage)</b>",
23 autoScroll: true,
24 iconCls: "back-stage" //样式名称
25 }]
26 });
27
28 var treenode = new Ext.tree.TreePanel({
29 //如果超出范围带自动滚动条
30 autoScroll: true,
31 animate: true,
32 root: root,
33 //默认根目录不显示
34 rootVisible: false,
35 border: false,
36 animate: true,
37 lines: true,
38 enableDD: true,
39 containerScroll: true,
40 listeners:
41 {
42 "click": function(node, event) {
43 //叶子节点点击不进入链接
44 if (node.isLeaf()) {
45 // 显示叶子节点菜单
46 event.stopEvent();
47 ALLEvents(node);
48 } else {
49 //不是叶子节点不触发事件
50 event.stopEvent();
51 //点击时展开
52 node.toggle();
53 }
54 }
55 }
56 });

  不知道有没有朋友遇到过类似的问题,或者是帮忙解决一下此问题,在这就先谢谢各位路过的朋友了~

  作者博客:http://zhf.cnblogs.com/

------分隔线----------------------------
------分隔线----------------------------

最新技术推荐