Browse Source

add preload image

张延森 3 years ago
parent
commit
195ca79cf8

BIN
public/images/result/resultbgi.jpg View File


BIN
public/images/signup/bgi.jpg View File


BIN
public/images/signup/preload.jpg View File


+ 1
- 1
src/pages/resultPage.vue View File

@@ -41,7 +41,7 @@ export default {
41 41
 .share {
42 42
   z-index: 3;
43 43
   position: absolute;
44
-  top: 154vw;
44
+  top: 100vw;
45 45
   /* align-items: center; */
46 46
   /* width: 47%; */
47 47
   /* margin: 0 auto; */

+ 21
- 0
src/pages/signup.vue View File

@@ -1,5 +1,8 @@
1 1
 <template>
2 2
   <div class="signup-box">
3
+    <div class="pre-load" :class="{ hide: !showPreload }" @click="showPreload = false">
4
+      <img src="../../public/images/signup/preload.jpg" alt="">
5
+    </div>
3 6
     <img class="bgi" src="../../public/images/signup/bgi.jpg" />
4 7
     <div class="form">
5 8
       <div class="formItem">
@@ -65,6 +68,7 @@ export default {
65 68
   },
66 69
   data() {
67 70
     return {
71
+      showPreload: true,
68 72
       showArea: false,
69 73
       checked: `./images/signup/checked.png`,
70 74
       Unchecked: `./images/signup/Unchecked.png`,
@@ -213,6 +217,23 @@ export default {
213 217
   height: 100%;
214 218
 }
215 219
 
220
+.pre-load {
221
+  position: fixed;
222
+  width: 100%;
223
+  min-height: 100%;
224
+  z-index: 100;
225
+  top: 0;
226
+  transition: top 1s ease;
227
+
228
+  & > img {
229
+    width: 100%;
230
+  }
231
+
232
+  &.hide {
233
+    top: -200vh;
234
+  }
235
+}
236
+
216 237
 .bgi {
217 238
   width: 100%;
218 239
   position: absolute;