最近做了个手机项目,为了优化交互在首屏有个 load 的动画.在其他设备上都是正常的,唯有 ios 上白屏,等到所有的 script 加载完成才会渲染.在 google 上没有查询到有用的结果.不知道有没有 v 友能提供一些帮助.
<!DOCTYPE html>
<html lang="en">
<head>
...省略
<style type="text/css">
.index-load {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.index-load img {
width: 80px;
height: 80px;
margin: 0px auto;
}
</style>
<!-- UI 组件库 1.0 -->
<script src="https://webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>
<link rel="stylesheet" href="./swiper.min.css" />
<script src="./swiper.min.js"></script>
</head>
<body>
<div id="root">
<div class="index-load">
<h4>loading...</h4>
</div>
</div>
<script type="text/javascript" src="manifest.bundle.e49239d9939be1e9d187.js" async></script>
<script type="text/javascript" src="vendors.21fb76d947bb4b3052a5.js" async></script>
<script type="text/javascript" src="index.b5c33feb2f5cb956513d.js" async></script>
</body>
</html>
如上代码,vendors.js
加载完成才会进行渲染,而尾部script
都已经加了async
关键字,但是毫无作用.
相关提问,非本人
谢谢.
1
love 2019-08-09 19:59:41 +08:00 via Android
加一个 defer 试一试?
|