Skip to content

Commit db30799

Browse files
AntecerAntecer
committed
优化资源加载,设置图片分流.
1 parent 293298b commit db30799

File tree

11 files changed

+188
-98
lines changed

11 files changed

+188
-98
lines changed

‎drivers/index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,13 @@
1313
<link rel="stylesheet" href="/resources/flagicons/css/flag-icon.css">
1414
<link rel="stylesheet" href="/resources/animate.css">
1515
<link rel="stylesheet" href="index.css">
16-
<script src="index.js" defer></script>
16+
<script src="index.js"></script>
1717
</head>
1818

1919
<body>
2020
<!--导航-->
2121
<div class="header fold animated fadeInDown">
2222
<link rel="stylesheet" href="/resources/head/index.css">
23-
<script src="/resources/head/index.js" defer></script>
2423
<div class="content">
2524
<div class="navpanel">
2625
<div class="navicon">AmusingDevice</div>
@@ -40,6 +39,7 @@
4039
<div class="cylist"></div>
4140
</div>
4241
</div>
42+
<script src="/resources/head/index.js"></script>
4343
</div>
4444
<!--页脚-->
4545
<div class="footer"></div>

‎home/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@
2020
<!--导航-->
2121
<div class="header fold animated fadeInDown">
2222
<link rel="stylesheet" href="/resources/head/index.css">
23-
<script src="/resources/head/index.js" defer></script>
2423
<div class="content">
2524
<div class="navpanel">
2625
<div class="navicon">AmusingDevice</div>
@@ -40,6 +39,7 @@
4039
<div class="cylist"></div>
4140
</div>
4241
</div>
42+
<script src="/resources/head/index.js"></script>
4343
</div>
4444
<!--页脚-->
4545
<div class="footer"></div>

‎home/index.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ function sleep(ms) {
1111
* @param {Function} good 判定成功后执行的回调函数
1212
* @param {Function} fail 判定失败后执行的回调函数
1313
*/
14-
function checkWebSiteOnline(good, fail) {
14+
function NetworkChecker(good, fail) {
1515
// 添加超时判断 0-未知,1-成功,2-失败,3-超时
1616
let isTimeOver = 0;
1717
// 新建image元素,作为判断依据
@@ -44,7 +44,7 @@ function checkWebSiteOnline(good, fail) {
4444
(async () => {
4545
while (!document.querySelector('.videoBox>iframe')) await sleep(500);
4646
let playBox = document.querySelector('.videoBox>iframe');
47-
checkWebSiteOnline(
47+
NetworkChecker(
4848
() => {
4949
if (window.location.host != `antecer.github.io`)
5050
playBox.src = `//antecer.github.io/videos/`;

‎prettify/index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,13 @@
1313
<link rel="stylesheet" href="/resources/flagicons/css/flag-icon.css">
1414
<link rel="stylesheet" href="/resources/animate.css">
1515
<link rel="stylesheet" href="index.css">
16-
<script src="index.js" defer></script>
16+
<script src="index.js"></script>
1717
</head>
1818

1919
<body>
2020
<!--导航-->
2121
<div class="header fold animated fadeInDown">
2222
<link rel="stylesheet" href="/resources/head/index.css">
23-
<script src="/resources/head/index.js" defer></script>
2423
<div class="content">
2524
<div class="navpanel">
2625
<div class="navicon">AmusingDevice</div>
@@ -40,6 +39,7 @@
4039
<div class="cylist"></div>
4140
</div>
4241
</div>
42+
<script src="/resources/head/index.js"></script>
4343
</div>
4444
<!--页脚-->
4545
<div class="footer"></div>

‎prettify/index.js‎

Lines changed: 21 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,22 @@
1-
document.querySelector('select[name="cutOptions"]').addEventListener('change', e => {
2-
let cutSelected = document.querySelector('select[name="cutOptions"]').value;
3-
document.querySelectorAll('.cutImg').forEach(cuter => {
4-
if (cuter.id == cutSelected) {
5-
cuter.classList.remove('hide');
6-
} else {
7-
cuter.classList.add('hide');
8-
}
1+
/**
2+
* 创建sleep方法(用于async / await的延时处理)
3+
* @param {int} ms 延时毫秒数
4+
*/
5+
function sleep(ms) {
6+
return new Promise(resolve => setTimeout(resolve, ms));
7+
}
8+
9+
(async () => {
10+
while (!document.querySelector('select[name="cutOptions"]')) await sleep(500);
11+
12+
document.querySelector('select[name="cutOptions"]').addEventListener('change', e => {
13+
let cutSelected = document.querySelector('select[name="cutOptions"]').value;
14+
document.querySelectorAll('.cutImg').forEach(cuter => {
15+
if (cuter.id == cutSelected) {
16+
cuter.classList.remove('hide');
17+
} else {
18+
cuter.classList.add('hide');
19+
}
20+
});
921
});
10-
});
22+
})();

products/secret.png renamed to products/default/secret.png

File renamed without changes.

‎products/index.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,14 @@
1313
<link rel="stylesheet" href="/resources/flagicons/css/flag-icon.css">
1414
<link rel="stylesheet" href="/resources/animate.css">
1515
<link rel="stylesheet" href="index.css">
16-
<script src="/resources/zoomimg.js" defer></script>
17-
<script src="index.js" defer></script>
16+
<script src="/resources/zoomimg.js"></script>
17+
<script src="index.js" async></script>
1818
</head>
1919

2020
<body>
2121
<!--导航-->
2222
<div class="header fold animated fadeInDown">
2323
<link rel="stylesheet" href="/resources/head/index.css">
24-
<script src="/resources/head/index.js" defer></script>
2524
<div class="content">
2625
<div class="navpanel">
2726
<div class="navicon">AmusingDevice</div>
@@ -41,6 +40,7 @@
4140
<div class="cylist"></div>
4241
</div>
4342
</div>
43+
<script src="/resources/head/index.js"></script>
4444
</div>
4545
<!--页脚-->
4646
<div class="footer animated fadeInRight">

‎products/index.js‎

Lines changed: 132 additions & 65 deletions
Large diffs are not rendered by default.

‎resources/zoomimg.js‎

Lines changed: 23 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
1-
var zoomCSS = document.createElement('style');
2-
zoomCSS.innerHTML = ".zoom { cursor: zoom-in; }";
3-
document.head.appendChild(zoomCSS);
1+
/**
2+
* 创建sleep方法(用于async / await的延时处理)
3+
* @param {int} ms 延时毫秒数
4+
*/
5+
function sleep(ms) {
6+
return new Promise(resolve => setTimeout(resolve, ms));
7+
}
48

5-
var zoomPanel = document.createElement('div');
6-
document.body.appendChild(zoomPanel);
7-
var zoomHtml = `
9+
const zoomHtml = `
810
<div onclick="this.style.display='none'"
911
style="
1012
position: fixed;
@@ -21,8 +23,19 @@ var zoomHtml = `
2123
style="width: 80%; object-fit: cover;">
2224
</div>`;
2325

24-
document.querySelectorAll('.zoom').forEach(img => {
25-
img.addEventListener('click', e => {
26-
zoomPanel.innerHTML = zoomHtml.replace('imgPath', img.src);
26+
(async () => {
27+
while (!document.querySelector('.zoom')) await sleep(1000);
28+
29+
var zoomCSS = document.createElement('style');
30+
zoomCSS.innerHTML = ".zoom { cursor: zoom-in; }";
31+
document.head.appendChild(zoomCSS);
32+
33+
var zoomPanel = document.createElement('div');
34+
document.body.appendChild(zoomPanel);
35+
36+
document.querySelectorAll('.zoom').forEach(img => {
37+
img.addEventListener('click', e => {
38+
zoomPanel.innerHTML = zoomHtml.replace('imgPath', img.src);
39+
});
2740
});
28-
});
41+
})();

‎support/index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,13 @@
1313
<link rel="stylesheet" href="/resources/flagicons/css/flag-icon.css">
1414
<link rel="stylesheet" href="/resources/animate.css">
1515
<link rel="stylesheet" href="index.css">
16-
<script src="index.js" defer></script>
16+
<script src="index.js"></script>
1717
</head>
1818

1919
<body>
2020
<!--导航-->
2121
<div class="header fold animated fadeInDown">
2222
<link rel="stylesheet" href="/resources/head/index.css">
23-
<script src="/resources/head/index.js" defer></script>
2423
<div class="content">
2524
<div class="navpanel">
2625
<div class="navicon">AmusingDevice</div>
@@ -40,6 +39,7 @@
4039
<div class="cylist"></div>
4140
</div>
4241
</div>
42+
<script src="/resources/head/index.js"></script>
4343
</div>
4444
<!--页脚-->
4545
<div class="footer"></div>

0 commit comments

Comments
 (0)