我在iframe
的主頁中顯示了幾頁。iframe在Chrome中的渲染
我在主頁面有一個背景圖片,當我點擊按鈕來改變框架內的頁面時,框架背景顏色變爲白色,直到頁面可見。
我將background-color:transpert
添加到頁面本身和主頁面CSS。
我用FireFox和IE檢查了網站,它看起來很好(框架的背景並沒有改變),但是使用Chrome瀏覽器時它渲染得很好,就像我想要的那樣,其他時候iframe背景變成白色。
我可以做任何事情來解決這個問題嗎?
我在iframe
的主頁中顯示了幾頁。iframe在Chrome中的渲染
我在主頁面有一個背景圖片,當我點擊按鈕來改變框架內的頁面時,框架背景顏色變爲白色,直到頁面可見。
我將background-color:transpert
添加到頁面本身和主頁面CSS。
我用FireFox和IE檢查了網站,它看起來很好(框架的背景並沒有改變),但是使用Chrome瀏覽器時它渲染得很好,就像我想要的那樣,其他時候iframe背景變成白色。
我可以做任何事情來解決這個問題嗎?
由於這是瀏覽器行爲,我懷疑它可以真正「固定」。
一種解決方法是隱藏幀,而它的加載(僅適用於Chrome瀏覽器) - 這裏是代碼:
var isChrome = (navigator.userAgent.indexOf("Chrome") >= 0);
function LoadFrame(url) {
var oFrame = document.getElementById("myframe");
if (isChrome) {
oFrame.style.visibility = "hidden";
oFrame.onload = function() {
oFrame.style.visibility = "visible";
};
}
oFrame.src = url;
}
Live test case。 (重新加載相同的框架,但概念是相同的)
工作像MAGIC謝謝你! – samy 2012-01-12 14:02:30
我用了非常相似的態度。這種方法僅適用於您的iFrame內部的頁面在您控制之下的情況。
的變化是,裏面的iframe頁面發現在父窗口的iframe,並再次使其可見:
<iframe style="visibility: hidden;" id="iframe_id" src="my_page.html" />
// inside my_page.html:
window.onload = function() {
// make sure the parent iframe is visible
if (window.parent)
{
var nodeIframe = window.parent.document.getElementById(window.name);
if (nodeIframe)
{
nodeIframe.style.visibility = "visible";
}
}
};
你的意思是它的白色,同時加載,然後當它完成加載它是OK? – 2012-01-12 13:33:02
yeap但只在鉻 – samy 2012-01-12 13:34:01
因爲這是瀏覽器的行爲,我懷疑它可以真正「固定」 - 一個解決方法是隱藏加載框架(僅適用於Chrome) - 如果相關讓我知道,我可以給示例代碼。 – 2012-01-12 13:36:56