Commit 7cff0fc7 by 颜景龙

loading效果

parent 2a7cba6a
......@@ -7,7 +7,8 @@
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<title>教练证书</title>
<title>教练证书</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
html {
......@@ -50,6 +51,15 @@
</style>
</head>
<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">
<!-- <img src="./1.jpg" />
<img src="./2.jpg" />
......@@ -104,6 +114,9 @@
var img = $(`<img src="${HTTP_URL}${list[i].originalPath}" />`);
img.appendTo('.image-list');
}
setTimeout(function() {
$('.loading').remove();
}, 200);
}
},
error: function(xhr, type){
......
/* * {
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);
}
}
......@@ -9,6 +9,7 @@
<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/form.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<title></title>
<style>
html {
......@@ -297,67 +298,20 @@
</style>
</head>
<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" />
<div class="class-banner">
</div>
<div class="gift-panel clearfix">
<ul id="gift-list" class="gift-list clearfix">
<!-- <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>
<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>
</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> -->
</ul>
</div>
<p id="description" class="description"></p>
......@@ -470,6 +424,9 @@
var data = result.data;
initGiftList(data.giftInfo);
//$('.class-banner').css({'background-image': `url(${HTTP_URL}${data.imgPath})`});
setTimeout(function() {
$('.loading').remove();
}, 200);
}
},
error: function(xhr, type){
......
......@@ -9,6 +9,7 @@
<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/form.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<title>礼品首页</title>
<style>
html {
......@@ -64,6 +65,15 @@
</style>
</head>
<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 class="img" src="./giftindex.jpg">
<!-- <button type="submit" id="submitBtn" class="zbtn zbtn-full zbtn-lg submit-btn">参加活动</button> -->
......@@ -105,6 +115,9 @@
location.href = './gift.html?id=' + id + "&customerUserId=" + customerUserId;
}
});
setTimeout(function() {
$('.loading').remove();
}, 200);
}
},
error: function(xhr, type){
......
......@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<title>团课详情</title>
<link rel="stylesheet" type="text/css" href="./css/loading.css">
<!-- <script src="./echarts.min.js"></script> -->
<style>
.page2 {
......@@ -55,7 +56,16 @@
</style>
</head>
<body class='page2'>
<div class='title'>
<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'>
<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>
</div>
......@@ -104,6 +114,9 @@
$('.introduction').text(resp.data.introduction);
$('.trainingEffect').text(resp.data.trainingEffect);
$('.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];
// var option = {
......
......@@ -7,6 +7,7 @@
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<link rel="stylesheet" type="text/css" href="./css/loading.css">
<title>团课约课规则</title>
<style>
html,
......@@ -48,6 +49,15 @@
</style>
<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">
<h3>约课</h3>
<p>每日13:00开放之后2天的团操课预约申请。</p>
......@@ -79,6 +89,9 @@
<script>
$(document).ready(function() {
$(window).ready(function(){
setTimeout(function() {
$('.loading').remove();
}, 200);
$('html').css({'font-size':$(window).width()/375*20});
});
$(window).resize(function(){
......
......@@ -9,6 +9,7 @@
<meta name="format-detection" content="telephone = no"/>
<title>私教课程详情</title>
<link rel="stylesheet" href='./class.css'>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
#className {
width: 60%;
......@@ -18,6 +19,15 @@
}
</style>
<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>
<div class="class-main">
......@@ -187,6 +197,10 @@
timeLine.append(timeUL);
$('#timeBody').append(timeLine);
}
setTimeout(function() {
$('.loading').remove();
}, 200);
}
});
}
......
......@@ -9,6 +9,7 @@
<meta name="format-detection" content="telephone = no"/>
<title>私教课程详情</title>
<link rel="stylesheet" href='./class.css'>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
#className {
width: 60%;
......@@ -18,6 +19,15 @@
}
</style>
<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>
<div class="class-main">
......@@ -75,6 +85,10 @@
$("<p></p>").text(obj.classTime).appendTo($(".class-block")[2]);
$("<p></p>").text(obj.suitableFor).appendTo($(".class-block")[3]);
$("<p></p>").text(obj.suggestion).appendTo($(".class-block")[4]);
setTimeout(function() {
$('.loading').remove();
}, 200);
}
});
}
......
......@@ -10,6 +10,7 @@
<title>私教课程详情</title>
<link rel="stylesheet" href='./class.css'>
<link rel="stylesheet" type="text/css" href="../css/iconfont.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
.detail-title {
background: #292C35;
......@@ -41,6 +42,15 @@
</style>
<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>
<div class="class-main">
......@@ -110,6 +120,10 @@
$("<p></p>").text(obj.introduction).appendTo($(".class-block")[0]);
$("<p></p>").text(obj.suitableFor).appendTo($(".class-block")[1]);
$("<p></p>").text(obj.suggestion).appendTo($(".class-block")[2]);
setTimeout(function() {
$('.loading').remove();
}, 200);
}
});
}
......
......@@ -10,6 +10,7 @@
<title>基础团课课程详情</title>
<link rel="stylesheet" href='./class.css'>
<link rel="stylesheet" type="text/css" href="../css/iconfont.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
.detail-title {
background: #292C35;
......@@ -50,6 +51,15 @@
</style>
<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>
<div class="class-main">
......@@ -128,6 +138,10 @@
$("<p></p>").text(obj.introduction).appendTo($(".class-block")[0]);
$("<p></p>").text(obj.suitableFor).appendTo($(".class-block")[1]);
$("<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];
// var option = {
......
......@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<title>精品团课课程详情</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
html {
......@@ -55,18 +56,27 @@
</style>
</head>
<body>
<h2 id="className">课程名称</h2>
<ul class="ul-list">
<li id="trainerName">
<i class="iconfont icon-user"></i>
</li>
<li id="time">
<i class="iconfont icon-naozhong-copy"></i>
</li>
<li id="address">
<i class="iconfont icon-address"></i>
</li>
</ul>
<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>
<ul class="ul-list">
<li id="trainerName">
<i class="iconfont icon-user"></i>
</li>
<li id="time">
<i class="iconfont icon-naozhong-copy"></i>
</li>
<li id="address">
<i class="iconfont icon-address"></i>
</li>
</ul>
<h3>课程详情</h3>
<div class="image-list">
......@@ -98,6 +108,9 @@
function(data){
var result = JSON.parse(data);
if (result.code == 0) {
setTimeout(function() {
$('.loading').remove();
}, 200);
var list = result.data;
for (var i=0; i<list.length; i++) {
var img = $(`<img src="${HTTP_URL}${list[i]}" />`);
......
......@@ -9,7 +9,7 @@
<meta name="format-detection" content="telephone = no"/>
<title>精品团课课程详情</title>
<link rel="stylesheet" type="text/css" href="../css/iconfont.css">
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
html {
......@@ -93,6 +93,15 @@
</style>
</head>
<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>
<div class="class-main">
......@@ -160,6 +169,8 @@
img.appendTo('.image-list');
}
}
$('.loading').remove();
}
});
}
......
......@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<title>服务协议</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
html,
body {
......@@ -100,6 +101,15 @@
</style>
</head>
<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">
<p>
<i class="header-return">
......@@ -128,6 +138,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script>
$(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
......
......@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<title>会员卡协议</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
html,
body {
......@@ -96,6 +97,15 @@
</style>
</head>
<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">
<p>
<i class="header-return">
......@@ -190,6 +200,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script>
$(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
......
......@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<title>私教会员卡协议</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
html,
body {
......@@ -96,6 +97,15 @@
</style>
</head>
<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">
<p>
<i class="header-return">
......@@ -173,6 +183,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script>
$(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
......
......@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<title>团课约课规则</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
html,
body {
......@@ -48,6 +49,15 @@
</style>
<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">
<h3>约课</h3>
<p>每日13:00开放之后2天的团操课预约申请。</p>
......@@ -78,10 +88,13 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script>
$(document).ready(function() {
$(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
$(window).resize(function(){
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
$(window).resize(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
});
......
......@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<title>私教约课规则</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
html,
body {
......@@ -55,6 +56,15 @@
</style>
<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>
<div class="main">
<h3>安全检查</h3>
......@@ -96,11 +106,14 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script>
$(document).ready(function() {
$(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
$(window).resize(function(){
$('html').css({'font-size':$(window).width()/375*20});
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
$(window).resize(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
});
......
......@@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=.0, maximum-scale=.0, user-scalable=no">
<meta name="format-detection" content="telephone = no"/>
<title>权益说明</title>
<link rel="stylesheet" type="text/css" href="../css/loading.css">
<style>
html,
body {
......@@ -50,6 +51,15 @@
</style>
</head>
<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>
<div class="content">
<h3>【超酷自助体验】</h3>
......@@ -70,6 +80,9 @@
<script src="https://cdn.bootcss.com/zepto/1.0rc1/zepto.min.js"></script>
<script>
$(document).ready(function() {
setTimeout(function() {
$('.loading').remove();
}, 200);
$(window).ready(function(){
$('html').css({'font-size':$(window).width()/375*20});
});
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此消息的编辑!
注册登录 后发表评论