mirror of
https://github.com/liudf0716/apfree_wifidog.git
synced 2025-01-07 03:16:37 +08:00
177 lines
6.3 KiB
Plaintext
177 lines
6.3 KiB
Plaintext
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
|
|
<meta http-equiv="X-UA-COMPATIBLE" content="IE=edge,chrome=1"/>
|
|
<!--[if lt IE 9]
|
|
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
|
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
|
|
<![endif]>-->
|
|
<title>正在为您加载，请稍候...</title>
|
|
<style>
|
|
body{
|
|
background-color:#1f2228;
|
|
}
|
|
.icon-cont{
|
|
width:100px;
|
|
height:100px;
|
|
margin:160px auto 50px;
|
|
padding-left:100px;
|
|
}
|
|
.hder{
|
|
font-family: "Microsoft YaHei";
|
|
font-weight:normal;
|
|
color:#77839b;
|
|
/*background: linear-gradient(#444, #222);*/
|
|
padding:10px 0;
|
|
text-align:center;
|
|
margin:0;
|
|
font-size:18px;
|
|
width:200px;
|
|
height:40px;
|
|
line-height: 40px;;
|
|
|
|
background-image: -webkit-linear-gradient(left, #0abcdf, #073064 25%, #0abcdf 50%, #073064 75%, #0abcdf);
|
|
-webkit-text-fill-color: transparent;
|
|
-webkit-background-clip: text;
|
|
-webkit-background-size: 200% 100%;
|
|
-webkit-animation: masked-animation 4s infinite linear;
|
|
text-fill-color: transparent;
|
|
background-clip: text;
|
|
background-size: 200% 100%;
|
|
animation: masked-animation 4s infinite linear;
|
|
}
|
|
.footer{
|
|
position: fixed;
|
|
bottom:20px;
|
|
text-align:center;
|
|
width:100%;
|
|
font-size:16px;
|
|
}
|
|
.text{
|
|
font-size:18px;
|
|
text-align:center;
|
|
font-family: "Microsoft YaHei";
|
|
color:#0abcdf;
|
|
width:350px;
|
|
margin:0 auto;
|
|
|
|
background-image: -webkit-linear-gradient(left, #0abcdf, #073064 25%, #0abcdf 50%, #073064 75%, #0abcdf);
|
|
-webkit-text-fill-color: transparent;
|
|
-webkit-background-clip: text;
|
|
-webkit-background-size: 200% 100%;
|
|
-webkit-animation: masked-animation 4s infinite linear;
|
|
text-fill-color: transparent;
|
|
background-clip: text;
|
|
background-size: 200% 100%;
|
|
animation: masked-animation 4s infinite linear;
|
|
}
|
|
@-webkit-keyframes masked-animation {
|
|
0% { background-position: 0 0;}
|
|
100% { background-position: -100% 0;}
|
|
}
|
|
|
|
@-webkit-keyframes ball-spin-fade-loader {
|
|
50% {
|
|
opacity: 0.3;
|
|
-webkit-transform: scale(0.4);
|
|
transform: scale(0.4); }
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1); } }
|
|
|
|
@keyframes ball-spin-fade-loader {
|
|
50% {
|
|
opacity: 0.3;
|
|
-webkit-transform: scale(0.4);
|
|
transform: scale(0.4); }
|
|
|
|
100% {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
transform: scale(1); } }
|
|
|
|
.ball-spin-fade-loader {
|
|
position: relative; }
|
|
.ball-spin-fade-loader > div:nth-child(1) {
|
|
top: 25px;
|
|
left: 0;
|
|
-webkit-animation: ball-spin-fade-loader 1s 0s infinite linear;
|
|
animation: ball-spin-fade-loader 1s 0s infinite linear; }
|
|
.ball-spin-fade-loader > div:nth-child(2) {
|
|
top: 17.04545px;
|
|
left: 17.04545px;
|
|
-webkit-animation: ball-spin-fade-loader 1s 0.12s infinite linear;
|
|
animation: ball-spin-fade-loader 1s 0.12s infinite linear; }
|
|
.ball-spin-fade-loader > div:nth-child(3) {
|
|
top: 0;
|
|
left: 25px;
|
|
-webkit-animation: ball-spin-fade-loader 1s 0.24s infinite linear;
|
|
animation: ball-spin-fade-loader 1s 0.24s infinite linear; }
|
|
.ball-spin-fade-loader > div:nth-child(4) {
|
|
top: -17.04545px;
|
|
left: 17.04545px;
|
|
-webkit-animation: ball-spin-fade-loader 1s 0.36s infinite linear;
|
|
animation: ball-spin-fade-loader 1s 0.36s infinite linear; }
|
|
.ball-spin-fade-loader > div:nth-child(5) {
|
|
top: -25px;
|
|
left: 0;
|
|
-webkit-animation: ball-spin-fade-loader 1s 0.48s infinite linear;
|
|
animation: ball-spin-fade-loader 1s 0.48s infinite linear; }
|
|
.ball-spin-fade-loader > div:nth-child(6) {
|
|
top: -17.04545px;
|
|
left: -17.04545px;
|
|
-webkit-animation: ball-spin-fade-loader 1s 0.6s infinite linear;
|
|
animation: ball-spin-fade-loader 1s 0.6s infinite linear; }
|
|
.ball-spin-fade-loader > div:nth-child(7) {
|
|
top: 0;
|
|
left: -25px;
|
|
-webkit-animation: ball-spin-fade-loader 1s 0.72s infinite linear;
|
|
animation: ball-spin-fade-loader 1s 0.72s infinite linear; }
|
|
.ball-spin-fade-loader > div:nth-child(8) {
|
|
top: 17.04545px;
|
|
left: -17.04545px;
|
|
-webkit-animation: ball-spin-fade-loader 1s 0.84s infinite linear;
|
|
animation: ball-spin-fade-loader 1s 0.84s infinite linear; }
|
|
.ball-spin-fade-loader > div {
|
|
/*background-color: #279fcf;*/
|
|
background-color:#0abcdf;
|
|
width: 15px;
|
|
height: 15px;
|
|
border-radius: 100%;
|
|
margin: 2px;
|
|
-webkit-animation-fill-mode: both;
|
|
animation-fill-mode: both;
|
|
position: absolute; }
|
|
</style>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div class="icon-cont">
|
|
<div class="loader">
|
|
<div class="loader-inner ball-spin-fade-loader">
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="text" style="font-size:24px;position: relative;">
|
|
<p>正在为您加载，请稍候...</p>
|
|
<!--<hr style="width:300px;margin:30px auto 10px;border-bottom:1px solid #77839b;border-top:1px solid #1f2228"/>-->
|
|
</div>
|
|
<h5 class="hder footer">坤腾畅联</h5>
|
|
</body>
|
|
|
|
<script type="text/javascript">
|