5

我的 iFrame 中有一个左侧导航，有两个项目，在两个页面之间切换。有时有白色闪光，有时没有。

到目前为止我尝试过的一些方法：

<iframe style="visibility:hidden;" onload="this.style.visibility = 'visible';">

没有做到这一点。

jQuery('#jobs-frame').load(function(){
    $(this).show();
});

jQuery('#primary a').click(function(){ 
    //alert('hello');
    jQuery('#jobs-frame').hide();
});

也没有做到这一点。我尝试过的任何其他方法似乎都已过时。让我感到困惑的是，以上 2 个解决方案有很多评论/反馈说它们有效，但是在 Chrome 中——我迄今为止测试过的唯一浏览器——我仍然遇到这个问题。

4

4 回答 4

1

我对动态生成的 iframe 也有类似的问题。在 Chrome 上，切换visibility消除了白色闪光，但仍有闪烁。在 Safari 上，切换display实际上引入了一个相关的 iframe 重绘错误。

最终为我工作的是切换opacity：

<iframe style="opacity: 0;" onload="this.style.opacity = 1;">`
于 2014-04-21T21:09:28.840 回答
0

如果您想避免“白色闪光”，请不要使用指向 HTML 页面的链接导航，而是将两个页面放入 2<div>秒并在它们之间切换（这也允许漂亮的动画）。

于 2013-12-12T16:31:41.217 回答
0

Chris Coyier 提供了一个非常优雅的解决方案，它比放置visibility属性更好。他有一个很好的解释为什么它更好，但简短的回答是“如果你使用visibility.

这是他的代码。把它放在你的，如果你已经有的话，<head>确保你把这个功能和你的结合起来。window.onload

(function () {    
    var div = document.createElement('div'),
        ref = document.getElementsByTagName('base')[0] || 
              document.getElementsByTagName('script')[0];

    div.innerHTML = '&shy;<style> iframe { visibility: hidden; } </style>';

    ref.parentNode.insertBefore(div, ref);

    window.onload = function() {
        div.parentNode.removeChild(div);
    }        
})();

它通过在页面上插入 CSS 来工作，这会使所有 iframe 不可见，因此 whiteflash 也不可见。当窗口加载时，CSS 被删除，一切都很好。

我们都应该感谢他这篇好文章，而不是我:)。

于 2020-12-23T15:08:22.783 回答
-1

只给style="background-color: #000000;"html 标签

于 2014-03-28T08:59:54.117 回答