CODEWITHSUNDEEP
javascriptcssflashiframeinternet-explorer-10
Jaider
Jaider

Reputation: 14914

IE10/Safari Cannot Hide an Object/Flash inside of iFrame

I have a Flash Animation inside of iFrame. And when I try to hide it, IE10 keep it displayed and overlapping other content.

<body style="background-color: #EEE">
    Testing IE10
    <div id="swfDiv">
        <iframe src="swf.html" width="500" height="50"></iframe>
        <br />
        <button onclick="document.getElementById('swfDiv').style.display='none'">Hide</button>
    </div>
    <div style="background-color: #DDD">
        This try to hide the animation, but it is not working on IE10.  <br/> It works fine in others browsers and earlier versions of IE.
    </div>
</body>

IE10

Update 02/08/2013 I found the same problem in Safari (5.1.7) enter image description here

Upvotes: 4

Views: 2289

Answers (2)

Davi Fiamenghi
Davi Fiamenghi

Reputation: 1265

Navigating away before closing the iframe solved my problem on a XBAP, I think it will work for flash too

var $iframe = $("#id");
$iframe[0].src = 'about:blank';
$iframe.remove();

Upvotes: 1

Jaider
Jaider

Reputation: 14914

Apparently the best solution will be move it off the screen:

.xhide
{
    display: block;
    position: absolute;
    left:-9999px;
}

We can add this class on click to hide it, something like:

document.getElementById('swfDiv').className = "xhide";

Upvotes: 5

Related Questions