iframe加载白屏闪烁解决方案

最新推荐文章于 2025-07-08 16:52:02 发布

原创最新推荐文章于 2025-07-08 16:52:02 发布 · 2.8k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #html #javascript

JavaScript 同时被 2 个专栏收录

14 篇文章

订阅专栏

10 篇文章

订阅专栏

文章讲述了如何利用onload事件在iframe内容加载完成后显示iframe，并在此过程中添加动画效果。通过设置iframe的display属性并在load事件中控制动画，实现了从隐藏到显示的平滑过渡。

onload 事件在iframe载入完成后被触发。

载入过程中隐藏，onload触发时显示，当然这个过程中可以做一些动画，在load事件中控制动画的显示隐藏即可

	<iframe id="iframe":src="`https://api.yxuer.com:8443/course/index.html#/answerPage/${userId}/${eval.questionGroupId}/${eval.id}/true`"
	style="width:100%;height:800px; display: none;"onload="this.style.display='block'" :style="iframeStyle" frameborder="0"
	scrolling="auto"></iframe>