解决jquery ui dialog 嵌入iframe时,resize动作过快时的bug

大家都知道,jquery ui dialog默认不支持iframe的,想使用可以用如下方法:


$('#dialog').html('<iframe src="http://www.sohu.com" width="100%" height="100%"></iframe>');


但是在拖拽改变大小时,如果鼠标移动过快,就会卡住,原因是鼠标事件移动到iframe里面去了,
解决的方法,是在拖拽开始时,创建一个div(透明的),覆盖住iframe,拖拽结束后,remove次iframe即可

我修改的是jquery.ui.resizable.js这个文件

创建div代码

el.find("iframe").each(function(){

var $dialog = $(this).parent().parent();
var $div = $('<div id="_iframe_p_" style="background-color:red;position:absolute;width:100%;height:100%;z-index:9999999"></div>')
$div.fadeTo(0);
$div.appendTo(el);
$div.css("left",0) ;
$div.css("top",0) ;

});


移除div


this.element.find("#_iframe_p_").remove();


大家可以下载到本地,覆盖原来的jquery.ui.resizable.js
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值