javascript - 在 jQuery 对话框中对齐 iframe

标签 javascript jquery css jquery-ui jquery-ui-dialog

我想将 iframe 显示到 jquery ui 对话框中。此 iframe 需要根据所需用户的对话框大小调整大小。该对话框应占据对话框的所有空间,但标题(顶部)和调整大小按钮(右下角)除外。

jQuery(document).ready(function(){
    jQuery("<div id ='container'><iframe src='http://www.google.com'></iframe></div>").dialog({modal:true,title:"Title",width:800,height:600});
});

任何想法?我对 css 的宽度和高度感到恼火。

最佳答案

请试试这个工作演示 http://jsfiddle.net/xyctR/18/

Iframe 将使用 jsfiddle 填充,然后您就可以看到行为了。

希望对您有所帮助,

以下代码将满足您的需要,即“需要根据所需用户的对话框大小调整大小。对话框应占据对话框的所有空间,但标题(顶部)和调整大小按钮除外”

代码

function showDialog(url){
   var iframe = $('<iframe id="modalIframeId" width="100%" height="100%" src='+url+' marginWidth="0" marginHeight="0" frameBorder="0" scrolling="auto" title="Dialog Title">Your browser does not support</iframe>')
    .on('load', function() {
        console.log('loaded');
    });

    $("#divId")
        .append('<div id="loading">Loading....</div>')
        .append(iframe)
        .dialog({modal:true,title:"Title",width:800,height:600});
}

showDialog('http://jsfiddle.net');

​**image**

enter image description here

关于javascript - 在 jQuery 对话框中对齐 iframe,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11136509/

相关文章:

javascript - 如何在饼图上正确绘制文本?

javascript - 使用 select2.js 选择文本的不同显示值

html - 使用显示 :block for links 时 IE 出现问题

javascript - 使用cherrypy和JavaScript的HTML进度条

javascript - 更改标题标签(选项卡)背景颜色

HTML 垂直导航栏高度到页脚

javascript - JSONP回调函数

javascript - 用户无法直接分享到他们的 Facebook 页面,只能分享到他们的个人资料

javascript - 错误消息 "DevTools failed to load SourceMap: Could not load content for chrome-extension://..."

jQuery 多状态切换