可視性属性がChromeで動作しなくなりました

Question

私は数か月前にWebアプリケーションを作成し、それを正常に動作するかどうか、つまりff &クロムで動作確認しました。

私は昨晩何かを追加するようになり、hide iframe機能がChromeで動作しなくなったことに気付きました。

要素を調べると、属性は実際に変化していますが、iframeは非表示になっていないことがわかります。

function hideIFrame(){ 
    document.getElementById("myFrame").style.visibility="hidden"; 
    self.focus(); 
} 

function showIFrame(){ 
    document.getElementById("myFrame").style.visibility="visible"; 
} 

myFrame divは非表示になります。正常に表示されますが、可視性が隠されたクロムに変更されたときは、それを隠していないので、それを隠すことになります。

なぜですか？

FIX：

function hideIFrame(){ 
    document.getElementById("myFrame").style.visibility="hidden"; 
    document.getElementById("myFrame").style.opacity=0; 
    self.focus(); 
} 

function showIFrame(){ 
    document.getElementById("myFrame").style.visibility="visible"; 
    document.getElementById("myFrame").style.opacity=1; 
} 

Answer 1

のiframeの可視性のトグル（$('iframe').css('visibility','hidden') not working in google chrome）に問題があります。あなたがそれを消したいならば、height、width：0を使います。単純に非表示にしたい場合は、opacity：0を使用します。

Answer 2

問題は発生しませんでした。関数を呼び出すコードをいくつか追加してください。ここでは、サンプルコードはクロムでうまく動作します。私の場合は

<script type="text/javascript"> 
function hideIFrame(){ 
document.getElementById("myFrame").style.visibility="hidden"; 
self.focus(); 
} 

function showIFrame(){ 
document.getElementById("myFrame").style.visibility="visible"; 
} 
</script> 

<input type="button" onclick="hideIFrame()" value="hide"/> 
<input type="button" onclick="showIFrame()" value="show"/> 

<iframe id="myFrame"> 

</iframe> 

Answer 3

は私だけの要素を非表示にするJSのonloadイベントを使用すると、私はあなたがjsfiddleを提供してもらえvisibility="visible"

window.onload = function() { 
    document.getElementById("newDiv").style.visibility = "hidden"; 
} 
function showHidden() { 
    document.getElementById("newDiv").style.visibility = "visible"; 
}