加载所有图像后加载页面

发布于 2024-11-17 23:54:38 字数 177 浏览 10 评论 0原文

我的背景图像相当大。当我的页面加载时，HTML 在背景图像加载到页面之前呈现。我希望背景图像首先加载到页面上，然后是 HTML。现在看起来很奇怪，因为没有背景图像，文本会被推高，而当加载背景图像时，所有文本都会被推到常规位置（看起来不太专业）。

无论如何，javascript 中是否可以实现此目的？

谢谢！

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

尸血腥色 2024-11-24 23:54:38

我认为预加载图像并不能解决您的问题，因为您希望在向用户显示 HTML 文档之前加载图像。

我没有确切的解决方案，但我所做的是在页面加载时向用户显示加载图像，然后在正文和图像完全加载时隐藏该加载图像。做到这一点

    <body onLoad="document.getElementById('mydiv').setAttribute('style','display:none');">
    <div id=mydiv style="position:absolute;top:0px;left:0px;width:100%;height:100%>
<center> <img src="loading.png>
</center>
</div>


    <!-- Other HTML content here -->

    </body>

这只是一个粗略的代码，希望这有帮助

I think pre-loading an image is not a solution to you problem since you want the Images to load Before the HTML document is displayed to the user.

i dont have an exact solution but what i did was show a LOADING image to the user while the page loads up and then hide that loading image when the body and images are completely loaded. to do this

    <body onLoad="document.getElementById('mydiv').setAttribute('style','display:none');">
    <div id=mydiv style="position:absolute;top:0px;left:0px;width:100%;height:100%>
<center> <img src="loading.png>
</center>
</div>


    <!-- Other HTML content here -->

    </body>

This is just a rough code, hope this helps

回复收藏 0 原文