YUI對話框/面板在IE iframe中不能正確顯示

我已經構建了一些彈出窗口 - 一些使用YUI對話框，一些使用面板。這些在FF，Windows Safari，Chrome中正確顯示。請參考下面的截圖：YUI對話框/面板在IE iframe中不能正確顯示

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 & 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

我以上所提供的博客的URL嵌入使用iframe以下網址。

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

我注意到，如果我直接從IE訪問此網址中，對話框顯示並渲染好嗎！所以我強烈地感覺到這與在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); 
       } 
      }); 
    } 
};

來源

2014-04-04 Mandar

對於任何人可能會遇到這個問題 - 我無法弄清楚使用YUI。所以我在IE上使用jquery-ui實現了我的彈出窗口。所以在所有非IE瀏覽器中，我使用YUI彈出窗口，而對於IE，這是使用jquery-ui完成的。

來源

2015-02-23 09:01:17 Mandar

YUI對話框/面板在IE iframe中不能正確顯示

回答

相關問題