怎么让图片优先于音频媒体文件加载
我的HTML大致结构
<html>
<head>
<link rel="stylesheet" href="styles/play.css" type="text/css"/>
<script type="text/javascript">(function preloadImages() {
if (document.images) {
var img1 = new Image();
img1.src = "./images/demo.png";
}
})();
</script>
</head>
<body>
<div style="display:none">
<div id="bg"></div>
</div>
<audio id="gameMusic" class="music"
src="http://m2.music.126.net/AOChMFXWryJzWO2vR5iwIw==/7797736464973704.mp3"
hidden="true" loop="true">
</audio>
</body>
</html>
play.css
#bg{
background-image:url("./images/demo.png")
}
发现即使预加载demo图片,媒体文件还是会先加载,demo会被pending起来等媒体加载完才开始加载。怎么才能使我的图片优先于音频文件加载?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
一般对资源加载顺序有要求时,我使用https://github.com/englercj/resource-loa...
浏览器并发请求数有一定限制,按照执行流程来说会先加载stylesheet文件的,没有测试过stylesheet里面的图片文件的加载顺序。
你的preloadImages在哪里执行的?
还有document.images这个是什么?
因为不知道你具体的需求,所以如果你要保证图片加载完成再加载媒体文件这个需求的话,可以使用代码来控制。
在图片加载完成之后,再加载媒体文件,大概流程是这样的: