Skip to content

Commit f75bacc

Browse files
L33Z22L11L33Z22L11
committed
优化界面/加载速度
1 parent 804f707 commit f75bacc

File tree

5 files changed

+23
-69
lines changed

5 files changed

+23
-69
lines changed

‎css/cover.css‎

Lines changed: 3 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,20 @@
11
#coverLaunch {
22
font-size: .6em;
3-
43
position: fixed;
54
z-index: 3;
65
top: 0;
76
right: 0;
87
bottom: 0;
98
left: 0;
10-
119
display: flex;
1210
flex-direction: column-reverse;
13-
1411
padding: 1rem;
15-
1612
animation: whiteSplash 2.5s forwards;
1713
text-align: center;
1814
pointer-events: none;
19-
2015
color: #333;
2116
background: #fff fixed center url(https://a.xuewuzhibu.cn/24/656d964db3c37-24.png) no-repeat;
22-
background-size: 40vw;
17+
background-size: 20em;
2318
}
2419

2520
@keyframes whiteSplash {
@@ -37,7 +32,6 @@
3732

3833
100% {
3934
display: none;
40-
4135
opacity: 0;
4236
}
4337
}
@@ -49,13 +43,10 @@
4943
right: 0;
5044
bottom: 0;
5145
left: 0;
52-
5346
display: flex;
5447
flex-direction: column;
5548
justify-content: space-between;
56-
57-
transition: .5s;
58-
49+
transition: .2s;
5950
background: #333 fixed center url(https://a.xuewuzhibu.cn/24/656ca7c42eb90-24.jpg);
6051
background-size: cover;
6152
}
@@ -71,24 +62,19 @@
7162
right: 0;
7263
bottom: 0;
7364
left: 0;
74-
7565
margin: 0;
76-
7766
background: rgba(0, 0, 0, .5);
78-
7967
backdrop-filter: blur(.2rem);
8068
}
8169

8270
.coverMain {
8371
display: flex;
8472
justify-content: center;
85-
8673
gap: 5vw;
8774
}
8875

8976
.skew {
9077
overflow: hidden;
91-
9278
transform: skew(-15deg);
9379
}
9480

@@ -102,17 +88,14 @@
10288
display: flex;
10389
align-items: center;
10490
justify-content: space-between;
105-
10691
width: 40vw;
10792
margin: .5rem;
10893
padding: .2rem;
109-
11094
background: #222;
11195
}
11296

11397
.coverMain>.info>.title>.titleBadge {
11498
height: calc(100% + 1rem);
115-
11699
color: #222;
117100
background: #fff;
118101
}
@@ -122,7 +105,6 @@
122105
align-items: center;
123106
flex-direction: column;
124107
justify-content: center;
125-
126108
width: 3.5em;
127109
height: 100%;
128110
}
@@ -133,7 +115,6 @@
133115

134116
.reskew>* {
135117
margin: 0 .5rem;
136-
137118
white-space: nowrap;
138119
text-overflow: ellipsis;
139120
}
@@ -146,11 +127,9 @@
146127

147128
.coverMain>.cover {
148129
position: relative;
149-
150130
width: 40vw;
151131
height: 30vw;
152132
margin: auto 0;
153-
154133
box-shadow: 0 0 2rem rgba(0, 0, 0, .5);
155134
}
156135

@@ -160,33 +139,27 @@
160139
right: -5vw;
161140
bottom: 0;
162141
left: -5vw;
163-
164142
background: #333 fixed center url(https://a.xuewuzhibu.cn/24/656ca7c42eb90-24.jpg);
165143
background-size: cover;
166144
}
167145

168146
#cover .loadingBar {
169147
position: relative;
170-
171148
overflow: hidden;
149+
padding: 0 .5em;
172150
}
173151

174152
#cover .loadingBar::after {
175153
position: absolute;
176154
z-index: 1;
177155
top: 0;
178156
left: 0;
179-
180157
display: block;
181-
182158
width: 100%;
183159
height: 100%;
184-
185160
content: '';
186161
animation: loadingBarMask 1s ease-in-out infinite;
187-
188162
background: #fff;
189-
190163
backdrop-filter: brightness(.6) contrast(3);
191164
mix-blend-mode: exclusion;
192165
}

‎css/cp.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
background: linear-gradient(30deg,
3535
rgba(51, 170, 255, 0.5),
3636
rgba(51, 187, 153, 0.5));
37-
/* backdrop-filter: blur(1em); */
37+
backdrop-filter: blur(.5em);
3838
}
3939

4040
#cp>div {

‎css/main.css‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,6 @@ body {
3434
align-items: baseline;
3535
flex-wrap: nowrap;
3636
justify-content: space-between;
37-
3837
}
3938

4039
.space {
@@ -166,6 +165,7 @@ footer {
166165
.bar,
167166
.card>* {
168167
transition: .2s;
168+
169169
/* border: 2px solid rgba(255, 255, 255, 0.4); */
170170

171171
background: rgba(255, 255, 255, .1);
@@ -249,8 +249,8 @@ footer {
249249
}
250250

251251
[data-title]::after {
252-
bottom: 1em;
253252
right: 0;
253+
bottom: 1em;
254254
width: 12em;
255255
padding: .1em;
256256
content: attr(data-title);

‎index.html‎

Lines changed: 14 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -96,13 +96,13 @@ <h2 id="mainslogan">考试时钟</h2>
9696
</div>
9797
</a>
9898
<div id="typelist" style="width:100%;">
99-
<a onclick="subject.switch(23)">23届</a>
10099
<a onclick="subject.switch(24)">高三日常</a>
101100
<a onclick="subject.switch(241)">高三理科</a>
102101
<a onclick="subject.switch(242)">高三文科</a>
103102
<a onclick="subject.switch(251)">高二物理</a>
104103
<a onclick="subject.switch(252)">高二历史</a>
105-
<a onclick="subject.switch(261)">高一</a>
104+
<a onclick="subject.switch(261)">高一考试</a>
105+
<a onclick="subject.switch(23)">23届<span class="shield">彩蛋</span></a>
106106
<a onclick="setTemp()"><i class="fa-regular fa-square-plus"></i> 临时</a>
107107
<a onclick="setTimer()"><i class="fa-solid fa-stopwatch"></i> 倒计时</a>
108108

@@ -135,9 +135,9 @@ <h2 id="mainslogan">考试时钟</h2>
135135
</div>
136136
<a onclick="displayCP()"><i class="fa-solid fa-list-check"></i> 背景菜单
137137
<span class="shield">Ctrl+右键</span></a>
138-
<a href="https://imgtg.com/album/54wL">
138+
<a href="https://img.tg/album/54wL">
139139
<i class="fa-solid fa-box-archive"></i> 一卷图库
140-
<span class="shield">更换图源</span>
140+
<!-- <span class="shield">更换图源</span> -->
141141
<!-- <span class="shield"><i class="fa-regular fa-eye"></i> 4.7w</span> -->
142142
</a>
143143
</div>
@@ -170,10 +170,11 @@ <h2 id="mainslogan">考试时钟</h2>
170170
<i class="fa-solid fa-hourglass-start"></i> 开始时间</a>
171171
<a onclick="fixMinutes(subject.end,'结束时间')">
172172
<i class="fa-solid fa-hourglass-end"></i> 结束时间</a>
173-
<a onclick="subject.to(prompt('考试类型',subject.on))">
173+
<a onclick="subject.to(prompt('考试类型',subject.current))">
174174
<i class="fa-solid fa-box-archive"></i> 类型</a>
175175
<!-- “离谱了，同样的代码在控制台和点击执行出来的就不一样” -->
176-
<a onclick="document.getElementById('type').innerHTML=prompt('机构名称','纸鹿教育')||exam[subject.on]()">
176+
<a onclick="document.getElementById('type').innerHTML=prompt('机构名称','纸鹿教育')
177+
||exam[subject.current].schedule()">
177178
<i class="fa-regular fa-building"></i> 机构</a>
178179
<a href="?debug=1"><i class="fa-solid fa-bug"></i> 调试</a>
179180
</div>
@@ -227,11 +228,11 @@ <h2 id="mainslogan">考试时钟</h2>
227228
<i class="fa-solid fa-image"></i>
228229
<span id="bg">背景：雨后校园</span>
229230
</p>
230-
<p><i class="fa-solid fa-hashtag"></i> 野生技协群：89 4656 456，
231-
<span class="hilit">招募各考试类型维护者，无需会代码！</span>
231+
<p style="color:#fff"><i class="fa-solid fa-hashtag"></i>
232+
欢迎小伙伴加入野生技协群：89 4656 456，同时招募各考试类型维护者，要能及时联系。</span>
232233
</p>
233234
<p><i class="fa-solid fa-file-arrow-up"></i>
234-
ver_7.0.3 anim_polyfill</p>
235+
ver_7.0.4 界面/加载速度优化</p>
235236
</div>
236237
</footer>
237238
</div>
@@ -286,25 +287,12 @@ <h2 id="mainslogan">考试时钟</h2>
286287
<details>
287288
<summary>野生技协@混技</summary>
288289
<div class="alist">
289-
<a><i class="fa-brands fa-qq"></i> 野生技协分群 169994096</a>
290+
<a><i class="fa-brands fa-qq"></i> 野生技协 群169994096</a>
290291
<a href="https://github.com/pubsite"><i class="fa-brands fa-github"></i> Github pubsite</a>
291-
<a><i class="fa-brands fa-qq"></i> 混技总群 894656456</a>
292+
<a><i class="fa-brands fa-qq"></i> 混技 群894656456</a>
292293
<a href="https://hi.thisis.host"><i class="fa-solid fa-earth-asia"></i> 官网 hi.thisis.host</a>
293294
</div>
294295
</details>
295-
<details>
296-
<summary>其他</summary>
297-
<a><i class="fa-brands fa-qq"></i> 方块茶话会群 1142349003</a>
298-
<details>
299-
<summary><i class="fa-brands fa-qq"></i> 其他个人QQ</summary>
300-
<div class="alist">
301-
<a>拾汘 393501440</a><a>Star 2692292636</a>
302-
<a>长安凛冬 2252855301</a><a>加零 3073246100</a><a>GX 63045083</a>
303-
<a>yl 1413488450</a><a>純粋な 378655447</a>
304-
</div>
305-
</details>
306-
</details>
307-
</details>
308296
</div>
309297
</div>
310298
</div>
@@ -313,12 +301,11 @@ <h2 id="mainslogan">考试时钟</h2>
313301
<script src="./js/gallery.js" msg interact></script>
314302

315303
<script>
316-
// send("留意到相关舆情并结合从高一获取的考试安排修正稿，经考试时钟项目组讨论，我们已将高三的“生物/地理”与“物理/历史”考试对调。\
317-
// <br>另，点击科目名称可直接修改，如有相关疑问，可浏览页面底部信息。");
304+
// send("我们需要人员提供考试信息，详见页面底部。");
318305
</script>
319306

320307
<link rel="stylesheet" href="https://fonts.font.im/css?family=Ubuntu:400,700">
321-
<link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/pubsite/GenshinWebfont/rel1.css">
308+
<!-- <link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/pubsite/GenshinWebfont/rel1.css"> -->
322309
</body>
323310

324311
</html>

‎js/cover.js‎

Lines changed: 3 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -37,14 +37,8 @@ function playCover(msg) {
3737
} catch { }
3838
eleCoverTips.innerHTML = msg || coverTips[~~(Math.random() * coverTips.length)]
3939
eleCover.style.display = "";
40-
setTimeout(function () {
41-
eleCover.style.opacity = "";
42-
}, 0);
43-
setTimeout(function () {
44-
eleCover.style.opacity = "0";
45-
}, 2000);
46-
setTimeout(function () {
47-
eleCover.style.display = "none";
48-
}, 2500);
40+
setTimeout(function () { eleCover.style.opacity = ""; }, 0);
41+
setTimeout(function () { eleCover.style.opacity = "0"; }, 2000);
42+
setTimeout(function () { eleCover.style.display = "none"; }, 2500);
4943
return msg;
5044
}

0 commit comments

Comments
 (0)