通过javascript更改源时,停止iframe闪烁白色

时间:2021-06-09 16:56:46

I have an iframe:

我有一个iframe:

<iframe id="main_frame" src="first_url.html" style="visibility:hidden;" onload="this.style.visibility = 'visible';"></iframe>

As you can see it has been set to not be visible while loading. This ensures that no 'white flash' occurs while the frame loads. However, if I change the source of the iframe by clicking this button:

如您所见,它已被设置为在加载时不可见。这可确保在帧加载时不会出现“白色闪烁”。但是,如果我通过单击此按钮更改iframe的源:

<button onclick="change_view('new_url.html')">change view</button>

..where the javascript function to change the source is:

..改变源的javascript函数是:

 function change_view(url) {
          var site = url
          document.getElementById('main_frame').src = site
            }

then I get the white flash while the source changes. Is there is a way to change the source of the iframe without getting this white flash?

然后,当光源发生变化时,我会看到白色闪光。有没有办法在不获得此白色闪光的情况下更改iframe的来源?

1 个解决方案

#1


You could try this

你可以试试这个

<iframe style="visibility:hidden;" onload="this.style.visibility = 'visible';" src="../examples/inlineframes1.html" > </iframe>

It hides iframe until fully loaded.

它隐藏iframe直到满载。

https://css-tricks.com/snippets/html/get-rid-of-white-flash-when-iframe-loads/

#1


You could try this

你可以试试这个

<iframe style="visibility:hidden;" onload="this.style.visibility = 'visible';" src="../examples/inlineframes1.html" > </iframe>

It hides iframe until fully loaded.

它隐藏iframe直到满载。

https://css-tricks.com/snippets/html/get-rid-of-white-flash-when-iframe-loads/