我想隱藏iframe直到它被加載以避免發生白色閃爍。 它始終發生在Internet Explorer 11和FireFox上有時在Chrome上如果頁面加載速度較慢。隱藏iframe直到它完全加載
HTML
<div class="test">
<div class="hover">hover me</div>
<div class="cool">cool</div>
</div>
CSS
body { background-color: black; }
.hover { border: solid red; height: 40px; width: 40px; z-index: 1; color: white; }
iframe {position: relative; left: 40px; }
.test { border: solid blue; position: absolute; height: 300px; width: 500px; z-index: 3; }
.cool { border: solid purple; background-color: black; }
jQuery的
$(document).ready(function(){
$(".hover").on({
mouseover: function(){
$(this).next('.cool').html('<iframe width="370" height="215" src="//tsn.com" frameborder="0" ></iframe>');
}
});
});
$(document).ready(function() {
$('.test').hover(function() {
}, function() {
$('.cool').html('');
});
});
我認爲你的問題將是接近這個副本... http://stackoverflow.com/questions/3142837/ capture-iframe-load-complete-event您需要確定何時加載框架,然後使其可見。另一個問答說明如何檢測幀加載事件。 – Kolban 2014-12-06 16:14:53
@Kolban我試圖隱藏iframe並在加載時顯示它,但它不起作用。我仍然得到那白色閃爍。看到這個小提琴http://jsfiddle.net/a91bmc4e/5/ – 2014-12-06 16:39:09