20211004

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

次のリビジョン
前のリビジョン
20211004 [2021/10/04 08:55] – 作成 133.11.144.1020211004 [Unknown date] (現在) – 削除 - 外部編集 (Unknown date) 127.0.0.1
行 1: 行 1:
-====== 20211004 ====== 
- 
-===== アップロード中の画面の作成 ===== 
- 
-index.pug (HTML部分) 
- 
-    #uploading(class="loaded") 
-        .spinner 
-         
-index.pug (Scriptタグ部分。クリック時イベントをトリガーとして実行。ここには記述しないが失敗時には再度ローディング画面が消える。) 
-         
-    var spinner = document.getElementById('uploading'); 
-    spinner.classList.remove("loaded"); 
-     
-main.css 
- 
-   /* ローディング画面 */ 
-   #uploading { 
-       width: 100vw; 
-       height: 100vh; 
-       transition: all 1s; 
-       background-color: #808080; 
-       position: fixed; 
-       top: 0; 
-       left: 0; 
-       z-index: 9999; 
-       opacity: 0.5; 
-   } 
- 
-   .spinner { 
-       width: 100px; 
-       height: 100px; 
-       margin: 200px auto; 
-       background-color: #fff; 
-       border-radius: 100%; 
-       animation: sk-scaleout 1.0s infinite ease-in-out; 
-   } 
-   /* ローディングアニメーション */ 
-   @keyframes sk-scaleout { 
-       0% { 
-           transform: scale(0); 
-       } 
-    
-       100% { 
-           transform: scale(1.0); 
-           opacity: 0; 
-       } 
-   } 
-    
-   .loaded { 
-       opacity: 0; 
-       visibility: hidden; 
-   } 
- 
  
  • 20211004.1633337754.txt.gz
  • 最終更新: 2021/10/04 08:55
  • by 133.11.144.10