honghe
/
h5-draw-lots
Watch 3
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

feats

张延森 3 years ago
parent
e8db36d5b6
commit
b6681d9938
4 changed files with 23 additions and 7 deletions
Unified View Show Diff Stats
  1. BIN
      public/images/loading.png
  2. BIN
      public/images/loadingBgc.jpg
  3. BIN
      public/images/loading_bar.png
  4. 23
    7
      public/index.html

BIN
public/images/loading.png View File


BIN
public/images/loadingBgc.jpg View File


BIN
public/images/loading_bar.png View File


+ 23
- 7
public/index.html View File

15 
         height: 100vh;
 15 
         height: 100vh;
16 
         overflow: hidden;
 16 
         overflow: hidden;
17 
         z-index: 999;
 17 
         z-index: 999;
18 
+        background: url(./images/loadingBgc.jpg) no-repeat 100% 100%;
19 
+        display: flex;
20 
+        justify-content: center;
21 
+        align-items: center;
18 
       }
 22 
       }
19
23
20 
       .page-loading {
 24 
       .page-loading {
21 
-        width: 100%;
22 
-        height: 100%;
23 
-        background: #262626 url('./loading.gif') no-repeat center center;
25 
+        width: 641px;
26 
+        height: 641px;
27 
+      }
28 
+
29 
+      .page-loading .loading-image {
30 
+        width: 146px;
31 
+        height: 146px;
32 
+        background: url(./images/loadingBgc.jpg) no-repeat 100% 100%;
24 
         animation: loadingrotate 2s linear infinite;
 33 
         animation: loadingrotate 2s linear infinite;
25 
       }
 34 
       }
26
35
36 
+      .page-loading .loading-tips {
37 
+        width: 100%;
38 
+        margin-top: 2em;
39 
+      }
40 
+
27 
       @keyframes loadingrotate {
 41 
       @keyframes loadingrotate {
28 
         100% {
 42 
         100% {
29 
           transform:rotate(360deg);
 43 
           transform:rotate(360deg);
32 
     </style>
 46 
     </style>
33 
   </head>
 47 
   </head>
34 
   <body>
 48 
   <body>
35 
-    <noscript>
36 
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
37 
-    </noscript>
38 
     <div class="page-loading-wrapper">
 49 
     <div class="page-loading-wrapper">
39 
-      <div class="page-loading"></div>
50 
+      <div class="page-loading">
51 
+        <div class="loading-image"></div>
52 
+        <div class="loading-tips">
53 
+          <img src="./images/loading_bar.png" width="100%" alt="">
54 
+        </div>
55 
+      </div>
40 
     </div>
 56 
     </div>
41 
     <div id="app"></div>
 57 
     <div id="app"></div>
42 
     <!-- built files will be auto injected -->
 58 
     <!-- built files will be auto injected -->