Question

我已经构建了一些弹出窗口 - 一些使用YUI对话框，一些使用面板。这些在FF，Windows Safari，Chrome中正确呈现。请参考以下屏幕截图：

http://dl.dropbox.com/u/7681433/YUI%20Forum%20Screenhots/WorkingDialog-Firefox.PNG http://dl.dropbox.com/u/7681433/YUI%20Forum%20Screenhots/WorkingPanel-Firefox.PNG

然而在IE 7,9＆amp; 10对话框有时会以扭曲的方式出现，有时会出现。请参阅下面的屏幕截图：

http://dl.dropbox.com/u/7681433/YUI%20Forum%20Screenhots/DistortedDialog-IE9.PNG http://dl.dropbox.com/u/7681433/YUI%20Forum%20Screenhots/DistortedPanel-IE9.PNG

我无法弄清楚IE中的有时出了什么问题。我使用的是YUI 2.7.0版。

要查看此操作，您可以访问此博客页面。将鼠标悬停在其中一个缩略图上，然后单击预览/下载/传输按钮。

http://embed-test-blog.blogspot.in/2012/04/sample-for-yui-forum.html

我上面提供的博客网址使用iframe嵌入了以下网址。

http://embed.mediapartner.com/embed.aspx?e=f2+Wk9GtFDM=

我注意到如果我直接从IE访问此URL，对话框似乎呈现正常！所以我强烈认为这与在IE中的iframe中调用的YUI对话框有关。但我无法弄清楚如何克服这个问题。有什么想法吗？

以下是我在上面的预览对话框中使用的代码 - 以防万一有任何帮助。

LargePreviewPopup =
{
popup: null,
    init: function()
    {
        this.popup = new YAHOO.widget.Panel("LargePreviewPopup",
        {
            width: "380px",
            height: "410px",
            zIndex: 3000,
            fixedcenter: true,
            visible: false,
            draggable: true,
            modal: true,
            constraintoviewport: false,
            effect: { effect: YAHOO.widget.ContainerEffect.FADE, duration: 0.10 }
        });
        if (YAHOO.env.ua.ie > 0)
            this.popup.cfg.setProperty("iframe", true);
        PluginFix.showHidePlugins(this.popup);
        this.popup.setHeader("NA");
        this.popup.setBody("NA");
        this.popup.render(document.body);
    },


onShowLargePreviewClick: function(userId, captionId, height, width)
    {
        if (!this.popup)
            this.init();
        this.popup.setBody("<div class='ajaxloader'></div>");
        this.popup.setHeader("Preview");

this.popup.hideEvent.subscribe(function()
        {
            LargePreviewPopup.popup.setBody("<div class='ajaxloader'></div>");
        });

this.popup.cfg.setProperty("height", height + 57 + "px");
        this.popup.cfg.setProperty("width", width + 35 + "px");
        this.popup.show();

var cObj = Custom.Ajax.asyncRequest('GET',
        '/embed/embed_operations.aspx?action=large_preview&amp;user_id=' + userId + '&amp;caption_id=' + captionId
            + '&amp;h=' + height + '&amp;w=' + width,
            {
                success: function(o)
                {
                    LargePreviewPopup.popup.setBody(o.responseText);
                }
            });
    }
};

Answer 1

对于任何可能面临这个问题的人 - 我无法用YUI来解决这个问题。所以我在IE上使用jquery-ui实现了我的弹出窗口。因此，在所有非IE浏览器中，我使用YUI弹出窗口，而对于IE，这是使用jquery-ui完成的。

在IE iframe中，YUI对话框/面板无法正确呈现

1 个答案: