Skip to content

成立 / weiduh5

转到一个项目
Commit 7cff0fc7 by 颜景龙
Options

loading效果

parent 2a7cba6a
内嵌 并排
正在显示 包含 369 行增加 和 57 行删除
certificate/certificate.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>教练证书</title> <title>教练证书</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
html { html {
...@@ -50,6 +51,15 @@ ...@@ -50,6 +51,15 @@
</style> </style>
</head> </head>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="image-list"> <div class="image-list">
<!-- <img src="./1.jpg" /> <!-- <img src="./1.jpg" />
<img src="./2.jpg" /> <img src="./2.jpg" />
...@@ -104,6 +114,9 @@ ...@@ -104,6 +114,9 @@
var img = $(`<img src="${HTTP_URL}${list[i].originalPath}" />`); var img = $(`<img src="${HTTP_URL}${list[i].originalPath}" />`);
img.appendTo('.image-list'); img.appendTo('.image-list');
} }
setTimeout(function() {
$('.loading').remove();
}, 200);
} }
}, },
error: function(xhr, type){ error: function(xhr, type){
......
css/loading.css 0 → 100644
/* * {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background: #000;
}
h1 {
color: #8f8f8f;
margin: 10px 30px;
font-weight: normal;
font-family: Verdana;
} */
.loading {
background: #FFF;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 999;
}
.wrap {
width: 100%;
position: absolute;
top: 50%;
}
.spinner-wrap {
margin: auto;
position: absolute;
left: 50%;
transform: translateX(-50%);
}
.spinner {
height: 100px;
width: 100px;
display: inline-block;
margin: -50px auto 0;
animation: spin 1s steps(12, end) infinite;
}
/*
.spinner:first-child {
margin-right: 50px;
} */
.spinner i {
height: 30px;
width: 6px;
margin-left: -3px;
display: block;
transition: height 1s;
position: absolute;
left: 50%;
transform-origin: center 50px;
background: rgba(99, 93, 93, 0.7);
box-shadow: 0 0 3px rgba(99, 93, 93, 0.7);
border-radius: 3px;
}
/* .spinner:nth-child(2) i {
height: 6px;
}
.spinner:hover i {
height: 6px;
} */
/* .spinner:hover:nth-child(2) i {
height: 30px;
} */
.spinner i:nth-child(1) {
opacity: .08;
}
.spinner i:nth-child(2) {
transform: rotate(30deg);
opacity: .167;
}
.spinner i:nth-child(3) {
transform: rotate(60deg);
opacity: .25;
}
.spinner i:nth-child(4) {
transform: rotate(90deg);
opacity: .33;
}
.spinner i:nth-child(5) {
transform: rotate(120deg);
opacity: .4167;
}
.spinner i:nth-child(6) {
transform: rotate(150deg);
opacity: .5;
}
.spinner i:nth-child(7) {
transform: rotate(180deg);
opacity: .583;
}
.spinner i:nth-child(8) {
transform: rotate(210deg);
opacity: .67;
}
.spinner i:nth-child(9) {
transform: rotate(240deg);
opacity: .75;
}
.spinner i:nth-child(10) {
transform: rotate(270deg);
opacity: .833;
}
.spinner i:nth-child(11) {
transform: rotate(300deg);
opacity: .9167;
}
.spinner i:nth-child(12) {
transform: rotate(330deg);
opacity: 1;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
gift/gift.html
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<link rel="stylesheet" type="text/css" href="../css/validate.css"> <link rel="stylesheet" type="text/css" href="../css/validate.css">
<link rel="stylesheet" type="text/css" href="../css/form.css"> <link rel="stylesheet" type="text/css" href="../css/form.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<title></title> <title></title>
<style> <style>
html { html {
...@@ -297,67 +298,20 @@ ...@@ -297,67 +298,20 @@
</style> </style>
</head> </head>
<body> <body>
<img id="return-img" class="return-img" src="./left_white.png" /> <div class="loading">
<div class="class-banner"> <div class="wrap">
</div> <div class="spinner-wrap">
<div class="gift-panel clearfix"> <div class="spinner">
<ul id="gift-list" class="gift-list clearfix"> <i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
<!-- <li class="gift-item">
<div class="card active">
<div class="card-body">
<img class="check" src="./checked.png" src="" />
</div>
<div class="card-footer">
<div class="card-type">
<span class="gift-name">XXXXXXXXXXXXXXX</span>
<span class="gift-price">¥233</span>
</div>
<p>xxxasdajshdjkhsajdkhasjkhdjksah</p>
</div>
</div>
</li>
<li class="gift-item">
<div class="card active">
<div class="card-body">
<img class="check" src="./checked.png" src="" />
</div>
<div class="card-footer">
<div class="card-type">
<span class="gift-name">XXXXXXXXXXXXXXX</span>
<span class="gift-price">¥233</span>
</div> </div>
<p>xxxasdajshdjkhsajdkhasjkhdjksah</p>
</div> </div>
</div> </div>
</li>
<li class="gift-item">
<div class="card">
<div class="card-body">
<img class="check" src="./checked.png" src="" />
</div>
<div class="card-footer">
<div class="card-type">
<span class="gift-name">XXXXXXXXXXXXXXX</span>
<span class="gift-price">¥233</span>
</div>
<p>xxxasdajshdjkhsajdkhasjkhdjksah</p>
</div>
</div>
</li>
<li class="gift-item">
<div class="card">
<div class="card-body">
<img class="check" src="./checked.png" src="" />
</div>
<div class="card-footer">
<div class="card-type">
<span class="gift-name">XXXXXXXXXXXXXXX</span>
<span class="gift-price">¥233</span>
</div>
<p>xxxasdajshdjkhsajdkhasjkhdjksah</p>
</div> </div>
<img id="return-img" class="return-img" src="./left_white.png" />
<div class="class-banner">
</div> </div>
</li> --> <div class="gift-panel clearfix">
<ul id="gift-list" class="gift-list clearfix">
</ul> </ul>
</div> </div>
<p id="description" class="description"></p> <p id="description" class="description"></p>
...@@ -470,6 +424,9 @@ ...@@ -470,6 +424,9 @@
var data = result.data; var data = result.data;
initGiftList(data.giftInfo); initGiftList(data.giftInfo);
//$('.class-banner').css({'background-image': `url(${HTTP_URL}${data.imgPath})`}); //$('.class-banner').css({'background-image': `url(${HTTP_URL}${data.imgPath})`});
setTimeout(function() {
$('.loading').remove();
}, 200);
} }
}, },
error: function(xhr, type){ error: function(xhr, type){
......
gift/giftindex.html
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<link rel="stylesheet" type="text/css" href="../css/validate.css"> <link rel="stylesheet" type="text/css" href="../css/validate.css">
<link rel="stylesheet" type="text/css" href="../css/form.css"> <link rel="stylesheet" type="text/css" href="../css/form.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<title>礼品首页</title> <title>礼品首页</title>
<style> <style>
html { html {
...@@ -64,6 +65,15 @@ ...@@ -64,6 +65,15 @@
</style> </style>
</head> </head>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<img id="return-img" class="return-img" src="./left_white.png" /> <img id="return-img" class="return-img" src="./left_white.png" />
<img class="img" src="./giftindex.jpg"> <img class="img" src="./giftindex.jpg">
<!-- <button type="submit" id="submitBtn" class="zbtn zbtn-full zbtn-lg submit-btn">参加活动</button> --> <!-- <button type="submit" id="submitBtn" class="zbtn zbtn-full zbtn-lg submit-btn">参加活动</button> -->
...@@ -105,6 +115,9 @@ ...@@ -105,6 +115,9 @@
location.href = './gift.html?id=' + id + "&customerUserId=" + customerUserId; location.href = './gift.html?id=' + id + "&customerUserId=" + customerUserId;
} }
}); });
setTimeout(function() {
$('.loading').remove();
}, 200);
} }
}, },
error: function(xhr, type){ error: function(xhr, type){
......
groupIntro.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>团课详情</title> <title>团课详情</title>
<link rel="stylesheet" type="text/css" href="./css/loading.css">
<!-- <script src="./echarts.min.js"></script> --> <!-- <script src="./echarts.min.js"></script> -->
<style> <style>
.page2 { .page2 {
...@@ -55,6 +56,15 @@ ...@@ -55,6 +56,15 @@
</style> </style>
</head> </head>
<body class='page2'> <body class='page2'>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class='title'> <div class='title'>
<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARoAAAE0CAYAAADzFfz8AAAGHklEQVR4nO3dTYsd5B2H4ZyZwxgno2IShZpUwap5MZbQaluqYEGtdtWFooJ+BRE3ogvRhStRC6UfoFBKpcsWaulCKNjiUsWXhSKC1pVujKaQF0f3rv7KfaKZ68r2+fGcgeGeZ3PI4sixm7Z3Df3q1lumk13333v36Pxll+8f37H46h/fTS//95Xx5vnf/SH4JN/eYjH/PXvqycfHmxuuPzrefH7y5Hjz0kv/Hm/+9OcXRufXxjcADAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBuefPNvxiPnn3m6fFmc3NzvOH88d7775/rj3BOXfnDg+PN4cPXBZ/k6376k+PjzcbGxui8Fw2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogNzyll/Ov1S5e/fu4KMA3xcPPnDf6LwXDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRAbrm1tTUera3N+/TppydG5994863xHceP/3i82bzwwvEGdrp9+/aOznvRADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbILVd10auvvT46/9DDj47v+Otf/jjeHDp07XgDzHjRADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbIrexLlSdP/n90/vTp0+M7vskG6HnRADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogtzzXH4CdYjFeXHLJxePNnb++bXT+xInPxne8/J9XxpudzosGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiDnu06sxMEDV4w3jz36yHhz1523j86fPfvF+I6//f0f483ll+0fb84nXjRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXK+VMlKHD1yaLy5/ujh8WZ9fX28mbrn7t+ON4vFzv6bvrN/emAlhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaIOdLlazEcnn+/KqdTz/LqnjRADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAueWqLlpfWx+dXywW4zsWa/MN0POiAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QW9mXKq+86uDo/G/uumN8x95LLx1vgJ4XDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiA3HLXru2VXHTNj64enX/yicfGd+zZszneAHPb27NueNEAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgtP/jwo/HozJkz84uWs/8U86KLtsZ3AKvxxptvj8570QA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5JYv/vNf49ENx46ONz//2Y2j81tbe8Z3wE536tSp8eadd98bb5597vej8140QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyiyPHbtqejvbv2ze+6MCBH4zOb1ywMb4DdrqzZ86ONx9//Ml488GH/xud96IBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZD7EhEJZarJIaQOAAAAAElFTkSuQmCC'/> <img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARoAAAE0CAYAAADzFfz8AAAGHklEQVR4nO3dTYsd5B2H4ZyZwxgno2IShZpUwap5MZbQaluqYEGtdtWFooJ+BRE3ogvRhStRC6UfoFBKpcsWaulCKNjiUsWXhSKC1pVujKaQF0f3rv7KfaKZ68r2+fGcgeGeZ3PI4sixm7Z3Df3q1lumk13333v36Pxll+8f37H46h/fTS//95Xx5vnf/SH4JN/eYjH/PXvqycfHmxuuPzrefH7y5Hjz0kv/Hm/+9OcXRufXxjcADAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBuefPNvxiPnn3m6fFmc3NzvOH88d7775/rj3BOXfnDg+PN4cPXBZ/k6376k+PjzcbGxui8Fw2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogNzyll/Ov1S5e/fu4KMA3xcPPnDf6LwXDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRAbrm1tTUera3N+/TppydG5994863xHceP/3i82bzwwvEGdrp9+/aOznvRADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbILVd10auvvT46/9DDj47v+Otf/jjeHDp07XgDzHjRADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbIrexLlSdP/n90/vTp0+M7vskG6HnRADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogtzzXH4CdYjFeXHLJxePNnb++bXT+xInPxne8/J9XxpudzosGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiDnu06sxMEDV4w3jz36yHhz1523j86fPfvF+I6//f0f483ll+0fb84nXjRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXK+VMlKHD1yaLy5/ujh8WZ9fX28mbrn7t+ON4vFzv6bvrN/emAlhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaIOdLlazEcnn+/KqdTz/LqnjRADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAueWqLlpfWx+dXywW4zsWa/MN0POiAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QW9mXKq+86uDo/G/uumN8x95LLx1vgJ4XDZATGiAnNEBOaICc0AA5oQFyQgPkhAbICQ2QExogJzRATmiA3HLXru2VXHTNj64enX/yicfGd+zZszneAHPb27NueNEAOaEBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgtP/jwo/HozJkz84uWs/8U86KLtsZ3AKvxxptvj8570QA5oQFyQgPkhAbICQ2QExogJzRATmiAnNAAOaEBckID5JYv/vNf49ENx46ONz//2Y2j81tbe8Z3wE536tSp8eadd98bb5597vej8140QE5ogJzQADmhAXJCA+SEBsgJDZATGiAnNEBOaICc0AA5oQFyiyPHbtqejvbv2ze+6MCBH4zOb1ywMb4DdrqzZ86ONx9//Ml488GH/xud96IBckID5IQGyAkNkBMaICc0QE5ogJzQADmhAXJCA+SEBsgJDZD7EhEJZarJIaQOAAAAAElFTkSuQmCC'/>
<span>课程介绍</span> <span>课程介绍</span>
...@@ -104,6 +114,9 @@ ...@@ -104,6 +114,9 @@
$('.introduction').text(resp.data.introduction); $('.introduction').text(resp.data.introduction);
$('.trainingEffect').text(resp.data.trainingEffect); $('.trainingEffect').text(resp.data.trainingEffect);
$('.suitableFor').text(resp.data.suitableFor); $('.suitableFor').text(resp.data.suitableFor);
setTimeout(function() {
$('.loading').remove();
}, 200);
// arr = [resp.data.consumeLevel,resp.data.coordinationLevel,resp.data.pliableLevel,resp.data.strengthLevel,resp.data.heartbeatLevel]; // arr = [resp.data.consumeLevel,resp.data.coordinationLevel,resp.data.pliableLevel,resp.data.strengthLevel,resp.data.heartbeatLevel];
// var option = { // var option = {
......
gz.html
...@@ -7,6 +7,7 @@ ...@@ -7,6 +7,7 @@
<meta name="renderer" content="webkit"> <meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<link rel="stylesheet" type="text/css" href="./css/loading.css">
<title>团课约课规则</title> <title>团课约课规则</title>
<style> <style>
html, html,
...@@ -48,6 +49,15 @@ ...@@ -48,6 +49,15 @@
</style> </style>
<body class="page1"> <body class="page1">
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="main"> <div class="main">
<h3>约课</h3> <h3>约课</h3>
<p>每日13:00开放之后2天的团操课预约申请。</p> <p>每日13:00开放之后2天的团操课预约申请。</p>
...@@ -79,6 +89,9 @@ ...@@ -79,6 +89,9 @@
<script> <script>
$(document).ready(function() { $(document).ready(function() {
$(window).ready(function(){ $(window).ready(function(){
setTimeout(function() {
$('.loading').remove();
}, 200);
$('html').css({'font-size':$(window).width()/375*20}); $('html').css({'font-size':$(window).width()/375*20});
}); });
$(window).resize(function(){ $(window).resize(function(){
......
personal/personalClassAppointDetail.html
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>私教课程详情</title> <title>私教课程详情</title>
<link rel="stylesheet" href='./class.css'> <link rel="stylesheet" href='./class.css'>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
#className { #className {
width: 60%; width: 60%;
...@@ -18,6 +19,15 @@ ...@@ -18,6 +19,15 @@
} }
</style> </style>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="class-banner"> <div class="class-banner">
</div> </div>
<div class="class-main"> <div class="class-main">
...@@ -187,6 +197,10 @@ ...@@ -187,6 +197,10 @@
timeLine.append(timeUL); timeLine.append(timeUL);
$('#timeBody').append(timeLine); $('#timeBody').append(timeLine);
} }
setTimeout(function() {
$('.loading').remove();
}, 200);
} }
}); });
} }
......
personal/personalDetail.html
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>私教课程详情</title> <title>私教课程详情</title>
<link rel="stylesheet" href='./class.css'> <link rel="stylesheet" href='./class.css'>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
#className { #className {
width: 60%; width: 60%;
...@@ -18,6 +19,15 @@ ...@@ -18,6 +19,15 @@
} }
</style> </style>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="class-banner"> <div class="class-banner">
</div> </div>
<div class="class-main"> <div class="class-main">
...@@ -75,6 +85,10 @@ ...@@ -75,6 +85,10 @@
$("<p></p>").text(obj.classTime).appendTo($(".class-block")[2]); $("<p></p>").text(obj.classTime).appendTo($(".class-block")[2]);
$("<p></p>").text(obj.suitableFor).appendTo($(".class-block")[3]); $("<p></p>").text(obj.suitableFor).appendTo($(".class-block")[3]);
$("<p></p>").text(obj.suggestion).appendTo($(".class-block")[4]); $("<p></p>").text(obj.suggestion).appendTo($(".class-block")[4]);
setTimeout(function() {
$('.loading').remove();
}, 200);
} }
}); });
} }
......
personal/personalDetailExtend.html
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
<title>私教课程详情</title> <title>私教课程详情</title>
<link rel="stylesheet" href='./class.css'> <link rel="stylesheet" href='./class.css'>
<link rel="stylesheet" type="text/css" href="../css/iconfont.css"> <link rel="stylesheet" type="text/css" href="../css/iconfont.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
.detail-title { .detail-title {
background: #292C35; background: #292C35;
...@@ -41,6 +42,15 @@ ...@@ -41,6 +42,15 @@
</style> </style>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="class-banner"> <div class="class-banner">
</div> </div>
<div class="class-main"> <div class="class-main">
...@@ -110,6 +120,10 @@ ...@@ -110,6 +120,10 @@
$("<p></p>").text(obj.introduction).appendTo($(".class-block")[0]); $("<p></p>").text(obj.introduction).appendTo($(".class-block")[0]);
$("<p></p>").text(obj.suitableFor).appendTo($(".class-block")[1]); $("<p></p>").text(obj.suitableFor).appendTo($(".class-block")[1]);
$("<p></p>").text(obj.suggestion).appendTo($(".class-block")[2]); $("<p></p>").text(obj.suggestion).appendTo($(".class-block")[2]);
setTimeout(function() {
$('.loading').remove();
}, 200);
} }
}); });
} }
......
prime/baseIntroExtend.html
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
<title>基础团课课程详情</title> <title>基础团课课程详情</title>
<link rel="stylesheet" href='./class.css'> <link rel="stylesheet" href='./class.css'>
<link rel="stylesheet" type="text/css" href="../css/iconfont.css"> <link rel="stylesheet" type="text/css" href="../css/iconfont.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
.detail-title { .detail-title {
background: #292C35; background: #292C35;
...@@ -50,6 +51,15 @@ ...@@ -50,6 +51,15 @@
</style> </style>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="class-banner"> <div class="class-banner">
</div> </div>
<div class="class-main"> <div class="class-main">
...@@ -129,6 +139,10 @@ ...@@ -129,6 +139,10 @@
$("<p></p>").text(obj.suitableFor).appendTo($(".class-block")[1]); $("<p></p>").text(obj.suitableFor).appendTo($(".class-block")[1]);
$("<p></p>").text(obj.suggestion).appendTo($(".class-block")[2]); $("<p></p>").text(obj.suggestion).appendTo($(".class-block")[2]);
setTimeout(function() {
$('.loading').remove();
}, 200);
// arrayList = [obj.consumeLevel, obj.coordinationLevel, obj.pliableLevel, obj.strengthLevel, obj.heartbeatLevel]; // arrayList = [obj.consumeLevel, obj.coordinationLevel, obj.pliableLevel, obj.strengthLevel, obj.heartbeatLevel];
// var option = { // var option = {
// tooltip: { // tooltip: {
......
prime/primeIntro.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>精品团课课程详情</title> <title>精品团课课程详情</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
html { html {
...@@ -55,6 +56,15 @@ ...@@ -55,6 +56,15 @@
</style> </style>
</head> </head>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<h2 id="className">课程名称</h2> <h2 id="className">课程名称</h2>
<ul class="ul-list"> <ul class="ul-list">
<li id="trainerName"> <li id="trainerName">
...@@ -98,6 +108,9 @@ ...@@ -98,6 +108,9 @@
function(data){ function(data){
var result = JSON.parse(data); var result = JSON.parse(data);
if (result.code == 0) { if (result.code == 0) {
setTimeout(function() {
$('.loading').remove();
}, 200);
var list = result.data; var list = result.data;
for (var i=0; i<list.length; i++) { for (var i=0; i<list.length; i++) {
var img = $(`<img src="${HTTP_URL}${list[i]}" />`); var img = $(`<img src="${HTTP_URL}${list[i]}" />`);
......
prime/primeIntroExtend.html
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>精品团课课程详情</title> <title>精品团课课程详情</title>
<link rel="stylesheet" type="text/css" href="../css/iconfont.css"> <link rel="stylesheet" type="text/css" href="../css/iconfont.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
html { html {
...@@ -93,6 +93,15 @@ ...@@ -93,6 +93,15 @@
</style> </style>
</head> </head>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="class-banner"> <div class="class-banner">
</div> </div>
<div class="class-main"> <div class="class-main">
...@@ -160,6 +169,8 @@ ...@@ -160,6 +169,8 @@
img.appendTo('.image-list'); img.appendTo('.image-list');
} }
} }
$('.loading').remove();
} }
}); });
} }
......
protocol/index.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>服务协议</title> <title>服务协议</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
html, html,
body { body {
...@@ -100,6 +101,15 @@ ...@@ -100,6 +101,15 @@
</style> </style>
</head> </head>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="header"> <div class="header">
<p> <p>
<i class="header-return"> <i class="header-return">
...@@ -128,6 +138,9 @@ ...@@ -128,6 +138,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script> <script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){ $(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20}); $('html').css({'font-size':$(window).width()/375*20});
}); });
......
protocol/membercard.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>会员卡协议</title> <title>会员卡协议</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
html, html,
body { body {
...@@ -96,6 +97,15 @@ ...@@ -96,6 +97,15 @@
</style> </style>
</head> </head>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="header"> <div class="header">
<p> <p>
<i class="header-return"> <i class="header-return">
...@@ -190,6 +200,9 @@ ...@@ -190,6 +200,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script> <script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){ $(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20}); $('html').css({'font-size':$(window).width()/375*20});
}); });
......
protocol/personcard.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>私教会员卡协议</title> <title>私教会员卡协议</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
html, html,
body { body {
...@@ -96,6 +97,15 @@ ...@@ -96,6 +97,15 @@
</style> </style>
</head> </head>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="header"> <div class="header">
<p> <p>
<i class="header-return"> <i class="header-return">
...@@ -173,6 +183,9 @@ ...@@ -173,6 +183,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script> <script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){ $(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20}); $('html').css({'font-size':$(window).width()/375*20});
}); });
......
rule/groupclass.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>团课约课规则</title> <title>团课约课规则</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
html, html,
body { body {
...@@ -48,6 +49,15 @@ ...@@ -48,6 +49,15 @@
</style> </style>
<body class="page1"> <body class="page1">
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<div class="main"> <div class="main">
<h3>约课</h3> <h3>约课</h3>
<p>每日13:00开放之后2天的团操课预约申请。</p> <p>每日13:00开放之后2天的团操课预约申请。</p>
...@@ -78,6 +88,9 @@ ...@@ -78,6 +88,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script> <script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){ $(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20}); $('html').css({'font-size':$(window).width()/375*20});
}); });
......
rule/personclass.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>私教约课规则</title> <title>私教约课规则</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
html, html,
body { body {
...@@ -55,6 +56,15 @@ ...@@ -55,6 +56,15 @@
</style> </style>
<body class="page1"> <body class="page1">
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<h2 class="title">上课须知</h2> <h2 class="title">上课须知</h2>
<div class="main"> <div class="main">
<h3>安全检查</h3> <h3>安全检查</h3>
...@@ -96,6 +106,9 @@ ...@@ -96,6 +106,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script> <script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){ $(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20}); $('html').css({'font-size':$(window).width()/375*20});
}); });
......
rule/powerinfo.html
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/> <meta name="format-detection" content="telephone = no"/>
<title>权益说明</title> <title>权益说明</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style> <style>
html, html,
body { body {
...@@ -50,6 +51,15 @@ ...@@ -50,6 +51,15 @@
</style> </style>
</head> </head>
<body> <body>
<div class="loading">
<div class="wrap">
<div class="spinner-wrap">
<div class="spinner">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
</div>
</div>
</div>
<h1>次卡会员权益</h1> <h1>次卡会员权益</h1>
<div class="content"> <div class="content">
<h3>【超酷自助体验】</h3> <h3>【超酷自助体验】</h3>
...@@ -70,6 +80,9 @@ ...@@ -70,6 +80,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script> <script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script> <script>
$(document).ready(function() { $(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){ $(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20}); $('html').css({'font-size':$(window).width()/375*20});
}); });
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此消息的编辑！
请 注册 或 登录 后发表评论