flex中iframe导致flash player崩溃问题

flash player版本:22.0,在我的开发环境(11.0)中没有出现如下问题。

1.flex组件在舞台中来回切换时iframe元素会多次加载到html元素中

如flex弹出窗口中包含iframe,多次弹出、关闭窗口,会发现html元素中有多个iframe标签,序号会自增,即便是销毁弹出窗口对象也没有用。

用firebug或浏览器自身的查看工具查看html元素,仔细观察会发现,iframe在随flex组件销毁对象时,只是把当前html元素的display属性设置为none,即iframe对象已经销毁,html中添加的iframe元素还存在。

这个时候,如果有操作或事件触发了窗口的resize 事件,那么先前所有的iframe都会触发resize事件,那些已经实际不存在但是还需要resize的iframe就会报错,提示某iframe对应的resize方法找不到。

TypeError: document.getElementById(...).iFrameBySource0_resize is not a function

解决办法:IFrame源码中有这样一句

this.addEventListener(Event.REMOVED_FROM_STAGE, handleRemove);

当iframe被从舞台移除时会触发,那么在handleRemove中调用IFrame中的removeIFrame()方法即可,删除该iframe包裹的html元素。

2.iframe需随flex动画动态改变大小时浏览器卡死


如上图中trigger的点击会触发左边区域以及右边包含lframe的flex区域进行大小的动态改变,动画通过Resize实现

<s:Resize id="leftAreaHideEffect" target="{leftArea}" widthTo="1" duration="100"/>
<pre name="code" class="html"><s:Resize id="leftAreaShowEffect" target="{leftArea}" widthTo="200" duration="100"/>

 在100毫秒内左侧区域的宽度会变为1,而右侧的flex区域会随左侧区域宽度的缩小而增大,反之是对应的动画效果。 

在向右侧移动时,flex区域的宽度会虽小,对应的iframe区域一样(设置的宽度是100%),这个时候就会出现浏览器卡死的现象,无法调试。

我的猜测是向右侧移动时,iframe的大小受到快速挤压,需要快速的响应布局且改变大小,可能导致了iframe内部错误(或死循环),因为使用flex替换掉该区域的iframe是没有问题的,并且在调试状态或动画时间设置比较大时没有该问题。

由于能力问题并没有找到导致该问题的根本原因,所以先搁置,使用替代方案。

解决办法:flex中Animate类中有一个属性disableLayout,官方给出的解释为:“如果为 true,则效果通过将容器的 autoLayout 属性设置为 false 对其目标的父容器禁用布局,并同时对目标对象禁用任何布局约束。效果完成时,将还原这些属性”。

即在动画期间禁用布局,也就是大小在这个阶段不发生改变,当动画结束时再瞬间达到动画预期的效果。

这样就暂时解决了该问题,但是如果动画效果比较明显且有该问题,这个方法可能不是最佳方案。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值