FancyBox (2.1.3) 在兼容模式下显示部分内容答案

【问题标题】：FancyBox (2.1.3) showing partial content in compatibility modeFancyBox (2.1.3) 在兼容模式下显示部分内容
【发布时间】：2012-10-24 18:29:59
【问题描述】：

我正在尝试将 fancybox 嵌入到 CRM2011 表单中以显示参考页面。问题是在兼容模式下内容似乎没有完全呈现。不幸的是，我无法控制 doctype 或 html 标签（为了符合 MS Dynamics）。

我意识到这可能甚至不属于 FancyBox 问题，但我只是希望你们能找到我可以开始寻找的地方。

这是我用来初始化的代码：

$.fancybox.open(
{
    href: 'https://myreferralpod.com/refapp/',
    title: 'Create Referral', // + name
    type: 'iframe',
    iframe: {preload: true},
    padding: 5,
    margin: [20,20,5,20],
    helpers : {
        overlay : {
            closeClick : false,
            showEarly  : false
        }
    },
    //autoResize : true,
    fitToView : true,
    width : '80%',
    height : '80%',
    openEffect : 'none',
    closeEffect : 'none',
    arrows: false
});

（抱歉，还不能发布图片）

以下是在兼容模式下显示的内容： Compatibility Mode

以下是常规显示的内容（需要） Regular Mode

【问题讨论】：

为什么选择fancybox？为什么不简单地使用 jQueryUI 的对话框方法呢？除了 jQueryUI，您还需要从 fancybox 中获得什么？
您需要帮助发布图片吗？ meta.stackexchange.com/questions/75491/…
如果你通过嵌入页面来创建一个简单的测试，例如，使用类似的东西 - 页面是否完全呈现？如果不是，那么问题出在页面上。
如果这是特定于浏览器的问题，请考虑添加该浏览器标签。
@gibberish：因为fancybox很酷；）

标签： jquery fancybox dynamics-crm dynamics-crm-2011 fancybox-2

【解决方案1】：

<div class="container" id="page"... 需要添加一个额外的 CSS 样式。尝试添加position:relative

这是在myreferralpod.com/refapp/ 页面内（不在 CRM 方面）。

【讨论】：

在 IE 开发者工具中添加这个可以显示内容。我将不得不与网站所有者交谈，看看这是否会对他们造成任何问题。你能解释一下这里发生了什么让它工作吗？我不经常深入研究这个领域，所以对它了解不多。
IE6/7 有一个奇怪的定位错误。当您进入兼容模式时，它会引发一些奇怪的错误。