|
|
@@ -26,18 +26,19 @@
|
|
|
width: 3.26rem;
|
|
|
height: 0.88rem;
|
|
|
}
|
|
|
- .header{
|
|
|
+ .imgs{
|
|
|
width: 7.5rem;
|
|
|
- height: 33vh;
|
|
|
+ height: 33.33vh;
|
|
|
+ display: block;
|
|
|
}
|
|
|
- .middle{
|
|
|
+ /* .middle{
|
|
|
width: 7.5rem;
|
|
|
height: 33vh;
|
|
|
}
|
|
|
.footer{
|
|
|
width: 7.5rem;
|
|
|
height: 34vh;
|
|
|
- }
|
|
|
+ } */
|
|
|
.img{
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
@@ -47,15 +48,6 @@
|
|
|
|
|
|
<body>
|
|
|
<div class="container">
|
|
|
- <div class="header">
|
|
|
- <img class="img" src="../static/img/zhongqiuActivity/header.png" />
|
|
|
- </div>
|
|
|
- <div class="middle">
|
|
|
- <img class="img" src="../static/img/zhongqiuActivity/middle.png" />
|
|
|
- </div>
|
|
|
- <div class="footer">
|
|
|
- <img class="img" src="../static/img/zhongqiuActivity/footer.png" />
|
|
|
- </div>
|
|
|
<div class="btn-content" id="js_btn">
|
|
|
<img class="download-app" src="../static/img/zhongqiuActivity/btn.png" />
|
|
|
</div>
|
|
|
@@ -80,16 +72,32 @@
|
|
|
id = loc.substr(n2 + 1, n1 - n2),//从=号后面的内容
|
|
|
u = navigator.userAgent,
|
|
|
isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
|
|
|
- isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
|
|
|
+ isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端
|
|
|
+ imgs = ['../static/img/zhongqiuActivity/header.png','../static/img/zhongqiuActivity/middle.png','../static/img/zhongqiuActivity/footer.png'];
|
|
|
//长屏判断
|
|
|
- console.log(document.documentElement.clientHeight)
|
|
|
if(document.documentElement.clientHeight > 736){
|
|
|
- $('.img')[0].src = '../static/img/zhongqiuActivity/iphoneX01.png';
|
|
|
- $('.img')[1].src = '../static/img/zhongqiuActivity/iphoneX02.png';
|
|
|
- $('.img')[2].src = '../static/img/zhongqiuActivity/iphoneX03.png';
|
|
|
+ imgs = ['../static/img/zhongqiuActivity/iphoneX01.png','../static/img/zhongqiuActivity/iphoneX02.png','../static/img/zhongqiuActivity/iphoneX03.png'];
|
|
|
const btnContent = document.getElementsByClassName('btn-content')[0];
|
|
|
btnContent.className = 'btn-active';
|
|
|
}
|
|
|
+ //异步加载图片
|
|
|
+ async function loadAsync() {
|
|
|
+ let promise = function(url) {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ const image = new Image();
|
|
|
+ image.src = url;
|
|
|
+ image.className = 'imgs';
|
|
|
+ image.onload = function() {
|
|
|
+ document.body.appendChild(image);
|
|
|
+ resolve('ok');
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ for(let url of imgs) {
|
|
|
+ await promise(url);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ loadAsync();
|
|
|
//埋点
|
|
|
if(isAndroid){
|
|
|
operate('中秋活动落地页');
|