我正在尝试使用JQuery创建一个对话框窗口.到目前为止我正在取得进展,但是遇到了一些iframe问题...我知道iframe通常不赞成,但它们是唯一能满足项目要求的东西.
无论如何,我可以成功实现可调整大小和可拖动的插件,但是如果用户拖动到快速并且鼠标悬停在对话框内部div中包含的iframe上,我会遇到问题.有点难以解释,但下面的代码应该有助于显示正在发生的事情.
几乎看起来,一旦鼠标越过iframe,iframe就会窃取mousedown事件的焦点.我想知道是否有任何办法解决这个问题.
谢谢,克里斯
<div id="container" style="border: solid 1px Black; padding: 10px 10px 10px 10px; height: 520px; width: 420px;">
<iframe id="if" src="http://google.com" style="width: 400px; height: 500px;"></iframe>
</div>
<script type="text/javascript" src="jquery-1.2.6.js"></script>
<script type="text/javascript" src="jquery.ui.all.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#container").draggable();
$("#container").resizable(
{
alsoResize: "#if"
}
).parent().draggable();
}
);
Run Code Online (Sandbox Code Playgroud)
编辑:为了运行应用程序,需要下载代码中引用的jquery文件.但代码应该与以前的版本向后兼容.
编辑:我稍微改变了代码以简化一些事情.
编辑:我找到了一种通过使用原型窗口库来解决此问题的替代方法.我宁愿使用jQuery而不是原型,因为许多基准测试都要好得多,但由于我的时间紧张,原型路由会做.如果有人有一些建议,我仍然有兴趣搞清楚这一点.再次感谢你的帮助.
编辑:如果我将iframe更改为div,上面的代码完美无瑕.这个问题似乎只是涉及可拖动和可调整大小的扩展功能的方式.