extjs Active遮挡用Ext.useShims=true遮挡层和原来大小不一样

2009-11-24 03:28:06 363 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

工程制图习题集张大庆课后习题答案解析所以，我想向大家求助，希望能得到一些学习资料、学习方法和学习经验，帮助我更好地理解和掌握这门课程。在寻找学习资料的过程中，我发现了一款叫做资小料的APP，它里面有很多关于工程制图的学习资料，包括视频教程、习题解答和考试真题等。通过使用资小料，我逐渐掌握了工程制图的基本理论和方法，解决了很多学习中遇到的问题。在这里，我想推荐给和我一样在学习《工程制图习题集》这门课的同学们，希望大家也能从这款APP中受益，共同进步。上传者：『Consentesdei』蒼迷穀。出版社：清华大学出版社。阅读详情

...全文

标准高斯过程回归（Gaussian Processes Regression, GPR）从零开始，公式推导标准高斯过程回归从零开始公式推导阅读详情

telwgs

Ajax 52,778 成员 25,334 内容

+ 关注 + 加入社区

切换为时间正序

善良的白兰地 2011-10-12

打赏
举报

终于解决了昨天碰到了菜单被applet挡住的问题，所采用的技术是Iframe Shim，参考文章是Using IFrame Shim to (partly) cover a Java applet
以下算是不断碰壁的简单总结吧，希望能对碰到类似问题的同仁有所帮助。
先说说基本Iframe Shim原理吧，我觉得是通过JavaScript动态创建iframe元素，同时设置相关的属性（比如z-index,postion等），来满足其浮动于applet或者其他插件之上。
我是用Ext做菜单的，所以采用的技术和方法都是和Ext相关，不过基本原理应该适合其他JavaScript框架的。
为此我用创建了id=inventory的Toolbar.Button组件，在其上又增加了几个Menu，现在增加代码如下：

javascript 代码
Ext.onReady(function(){
var tb = Ext.getCmp('inventory');
tb.on('menushow',function(toolbar,menu) {
var menuEl = menu.getEl();
createShim({
top:menuEl.getY(),
left:menuEl.getX(),
width:menuEl.getWidth(),
height:menuEl.getHeight()
});
});
tb.on('menuhide',function(toolbar,menu) {
var shimmer = document.getElementById('shimmer')
document.body.removeChild(shimmer);
});
});
function createShim(coordinate) {
var shimmer = document.createElement('iframe');
shimmer.id='shimmer';
shimmer.style.position='absolute';
shimmer.style.top=coordinate.top;
shimmer.style.left=coordinate.left;
shimmer.style.width=coordinate.width;
shimmer.style.height=coordinate.height;
shimmer.style.zIndex='999';
shimmer.setAttribute('frameborder','0');
shimmer.setAttribute('src','javascript:false;');
document.body.appendChild(shimmer);
}

首先在menushow事件中，动态创建shimmer，设置其position,left,top,width,height，zIndex等属性，要确保菜单的zIndex大于iframe的，还要确保iframe里边没有内容，即src应该为空。
其次在menuhide事件中移出动态创建的shimmer.
以上代码可以执行，非常感谢Ext为我们提供了便利的事件监听机制。

sean1203 2009-12-15

打赏
举报

不是没人回答，只是没人知道

extjs Active遮挡用Ext.useShims=true遮挡层和原来大小不一样

相关推荐