`
askwhy
  • 浏览: 2506 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

如何消除Ext.Window划过IFrame窗口时的阻滞效果

阅读更多
当拖拽一个Ext.Window控件经过IFrame窗口时,会出现移动阻滞现象,而如果在IFrame范围外拖拽移动则一切正常。
个人判断似乎是由于跨窗体对象的坐标计算或事件传递相对困难所致...

(具体现象可通过运行附件里的参考代码来重现)


请问各位有没有碰到类似问题?是否有好的解决方案?(有一种说法是通过div遮挡iframe的方式来“阻隔”iframe窗体对Ext.Window控件移动的影响,不知是否可行?)


请注意问题前提:使用IFrame方式载入Tab子页面是既定方案,无法更改,因此不能考虑autoLoad机制(何况这种机制使用起来也有些复杂问题要解决)

分享到:
评论
3 楼 askwhy 2009-09-12  
有研究过Ext.Window拖拽操作源代码的Javascript和ExtJS达人吗?或许可以在源代码基础上解释为什么在IFrame和非IFrame区域存在流畅性的区别
2 楼 askwhy 2009-09-11  
kimmking 写道
ie里,iframe select 等不是正常html组件,不会受z-order影响,而是object 一个解决办法,移动window或是mask的时候,display掉所有的ifame和select


谢谢回复。恕我贪心一点,可否在我所提供的源代码作一点具体改进措施。(为了更好说明问题,我稍微修改了一下演示代码,让其中一个Tab子页面通过IFrame方式载入Google页面,另一个Tab子页面仅载入简单Html文本,请注意重新下载运行并观察当Window分别移动经过这两个Tab子页面时的不同表现)

其实ExtJS在拖拽移动Window时已经为我们考虑得很周到了,包括被这个Window所遮挡的iframe中的select控件都得到了很好的处理(原理恰如楼上所说),通过运行代码实例也可以看出,移动过程中并不会出现任何不恰当的遮挡或显示,即便当拖拽Window经过IFrame区域时也还算工作正常,唯一的缺陷就在于远不如非IFrame区域那样移动流畅,确实很想知道这两者的区别何在。。。
1 楼 kimmking 2009-09-11  
ie里,iframe select 等不是正常html组件,不会受z-order影响,而是object 一个解决办法,移动window或是mask的时候,display掉所有的ifame和select

相关推荐

    一个简单的Ext.Window中插入图片的例子

    在Ext JS这个强大的JavaScript框架中,`Ext.Window`是一个常用组件,用于创建浮动、可弹出的窗口。在Web应用程序中,我们常常需要在这些窗口中展示各种内容,包括文字、表格、按钮,当然还有图片。本文将详细介绍...

    Ext.window从右下角弹出/隐藏

    本文将详细探讨如何在ExtJS中实现一个窗口(`Ext.window`)从右下角动态弹出并隐藏的功能,类似于即时通讯软件(如MSN)中的登录提醒。 #### 二、关键技术点 ##### 1. **自定义窗口类** 为了实现上述需求,首先...

    Ext.window的一个扩展组件SuperWin.js

    Ext.window的一个扩展组件SuperWin.js.可灵活自主随意定位,和显示模式;

    Ext.get与Ext.fly的区别

    - **多次操作时效率较低**:如果需要对同一个DOM元素进行多次操作,则每次调用`Ext.fly`都会重新创建`Ext.Element`对象,不如`Ext.get`高效。 #### 使用场景分析 - 当需要对DOM元素进行频繁操作时,推荐使用`Ext....

    extjs-Ext.ux.form.LovCombo下拉框

    它提供了丰富的组件库,包括表格、窗口、面板、菜单等,而`Ext.ux.form.LovCombo`就是EXTJS生态系统中的一员。 在压缩包子文件的文件名称列表中提到的"extjs下拉",很可能包含了EXTJS下拉框相关的示例代码、样式...

    EasyExt_003_第一个组件Ext.Window

    EasyExt_003_第一个组件Ext.Window EasyExt_003_第一个组件Ext.Window

    Ext-window属性

    当Panel被用作窗口时,它通常会继承或包含`Ext.window.Window`的一些属性。以下是对`Ext.Panel` API中与`Window`相关的属性的详细解释: 1. **activeItem**: 这个属性用于指定当前活动的子组件,可以是子组件的序号...

    Ext.Ajax.request2.x实现同步请求

    同时,`Ext.Ajax`还支持全局配置,通过`Ext.Ajax.defaults`可以设置默认的请求配置,这在处理大量请求时非常有用。 总结来说,`Ext.Ajax.request`在EXTJS中是进行Ajax通信的关键工具,通过调整其配置参数,我们可以...

    Ext.get与Ext.fly 的区别

    在EXTJS这个强大的JavaScript框架中,`Ext.get`和`Ext.fly`是两个非常重要的方法,它们都用于操作DOM元素,但它们之间存在着微妙的差异。了解这些差异对于优化代码性能和理解EXTJS的工作机制至关重要。 首先,`Ext....

    Ext.data.Store的基本用法

    这样做会使得`Ext.data.Store`在向服务器请求数据时自动添加`sort`和`dir`参数,从而让服务器端能够根据这些参数进行排序处理。 ```javascript var store = new Ext.data.Store({ proxy: new Ext.data.HttpProxy({...

    org.restlet.ext.spring.jar

    org.restlet.ext.spring.jar

    EXT dojochina文本框示例Ext.form.TextField.rar

    8. **组合框模式**:`Ext.form.TextField`还可以扩展为`Ext.form.ComboBox`,实现下拉选择功能,这在需要用户从预定义选项中选择时非常有用。 在压缩包中的`Ext.form.TextField`文件夹,很可能是包含了一个或者多个...

    EXT.form组件

    EXT.form组件的事件处理也很重要,例如`Ext.form.TriggerField`的`onTriggerClick`事件,会在用户点击触发按钮时触发,通常用于执行下拉菜单的显示或隐藏操作。 EXT.form组件的灵活性和丰富性使得开发者可以轻松地...

    Ext.Store的获取方法

    在Ext.js中,`Ext.Store`是用来管理数据的类,它通常与各种UI组件(如Grid、ComboBox等)关联,用于存储和检索数据。然而,获取`Ext.Store`的方式并不像获取其他Ext组件那样直接,因为Store并不是一个具有可视界面的...

    extjs中Ext.Panel和TreePanel 组件动态加载本地页面数据

    在EXTJS这个强大的JavaScript框架中,`Ext.Panel`和`TreePanel`是两个非常重要的组件,它们被广泛用于构建复杂的用户界面。这篇文章将探讨如何在这些组件中动态加载本地页面数据,以提升用户体验并实现灵活的数据...

    Ext.ux.SwfUploadPanel.js

    在实际使用`Ext.ux.SwfUploadPanel.js`时,你需要在ExtJS应用程序中引入这个文件,并配置相关参数,例如服务器端处理脚本地址、允许的文件类型、最大文件大小等。然后,你可以像创建其他ExtJS组件一样,实例化...

    Ext.js教程和Ext.js API

    Ext.js 是一个强大的JavaScript库,专门用于构建富客户端的Web应用程序。它提供了丰富的用户界面组件和数据绑定功能,使得开发者可以构建出具有桌面应用级别的交互式网页应用。本教程和API文档聚焦于Ext.js 3.0版本...

    Ext window的使用

    Ext.Window是Ext JS中的一个类,继承自Ext.container.Container,它创建了一个可以在页面上自由移动和调整大小的浮动窗口。窗口通常用作模态对话框、信息提示或其他需要用户交互的场景。 2. **创建一个基本的Ext....

    vbe6ext.olb

    运行Microsoft office时,vbe6ext.olb不能加载

    Ext3.2的Ext.data.Store类和Ext.Ajax类的实际运用

    环境:Window XP Sp2、Tomcat 6.0、MyEclipse 5.5、Ext 3.2 使用步骤: 1、下载解压缩之后,使用IDE导入工程 2、在MyEclipse中启动服务器 3、打开IE在地址栏输入:http://localhost:8080/ExtAjax/TestAjax.html 如果...

Global site tag (gtag.js) - Google Analytics