Difference between revisions of "Team:NKU CHINA"
| Line 6: | Line 6: | ||
margin-right:2px!important; | margin-right:2px!important; | ||
padding:0px !important; | padding:0px !important; | ||
| + | } | ||
| + | .loading { | ||
| + | width: 100%; | ||
| + | height: 100%; | ||
| + | background: black; | ||
| + | position: fixed; | ||
| + | top:0; | ||
| + | left:0; | ||
| + | } | ||
| + | |||
| + | .loader-ring { | ||
| + | position: absolute; | ||
| + | top: 50%; | ||
| + | left: 50%; | ||
| + | margin: -120px 0 0 -120px; | ||
| + | width: 240px; | ||
| + | height: 240px; | ||
| + | } | ||
| + | |||
| + | .loader-ring-light { | ||
| + | width: 240px; | ||
| + | height: 240px; | ||
| + | -moz-border-radius: 240px; | ||
| + | -webkit-border-radius: 240px; | ||
| + | border-radius: 240px; | ||
| + | -moz-box-shadow: 0 4px 0 #00abf2 inset; | ||
| + | -webkit-box-shadow: 0 4px 0 #00abf2 inset; | ||
| + | box-shadow: 0 4px 0 #00abf2 inset; | ||
| + | animation: rotate-360 2s linear infinite; | ||
| + | } | ||
| + | |||
| + | .loader-ring-track { | ||
| + | position: absolute; | ||
| + | top: 0; | ||
| + | left: 0; | ||
| + | width: 240px; | ||
| + | height: 240px; | ||
| + | -moz-border-radius: 240px; | ||
| + | -webkit-border-radius: 240px; | ||
| + | border-radius: 240px; | ||
| + | -moz-box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.3) inset; | ||
| + | -webkit-box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.3) inset; | ||
| + | box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.3) inset; | ||
| + | } | ||
| + | |||
| + | @keyframes rotate-360 { | ||
| + | from { | ||
| + | -moz-transform: rotate(0); | ||
| + | -ms-transform: rotate(0); | ||
| + | -webkit-transform: rotate(0); | ||
| + | -o-transform: rotate(0); | ||
| + | transform: rotate(0); | ||
| + | } | ||
| + | to { | ||
| + | -moz-transform: rotate(360deg); | ||
| + | -ms-transform: rotate(360deg); | ||
| + | -webkit-transform: rotate(360deg); | ||
| + | -o-transform: rotate(360deg); | ||
| + | transform: rotate(360deg); | ||
| + | } | ||
} | } | ||
</style> | </style> | ||
| + | <script type="text/javascript"> | ||
| + | document.onreadystatechange=function(){ | ||
| + | console.log(document.readyState); | ||
| + | if(document.readyState=="complete"){ | ||
| + | $(".loading").fadeOut(); | ||
| + | $(".loader-ring").fadeOut(); | ||
| + | } | ||
| + | } | ||
| + | </script> | ||
</head> | </head> | ||
<body> | <body> | ||
| + | <div class="loading"> | ||
| + | <p style="color: white; position: absolute;top: 47%;left: 47.5%;">Loading...</p> | ||
| + | </div> | ||
| + | <div class="loader-ring"> | ||
| + | <div class="loader-ring-light"></div> | ||
| + | <div class="loader-ring-track"></div> | ||
| + | </div> | ||
<div> | <div> | ||
<img class="myBackground" src="https://static.igem.org/mediawiki/2018/6/64/T--NKU_CHINA--background.jpg"> | <img class="myBackground" src="https://static.igem.org/mediawiki/2018/6/64/T--NKU_CHINA--background.jpg"> | ||
Revision as of 12:48, 13 October 2018
Loading...
