Skip to content

Commit

Permalink
维护网站
Browse files Browse the repository at this point in the history
  • Loading branch information
@ProgramCX
ProgramCX committed Aug 6, 2024
1 parent a1625cf commit 91bdb9a
Show file tree
Hide file tree
Showing 2 changed files with 268 additions and 269 deletions.
320 changes: 160 additions & 160 deletions example.html
View file
Original file line number Diff line number Diff line change
@@ -1,161 +1,161 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title id="title">精彩即将呈现...</title>
<link rel="stylesheet" href="examp.css">
<base target="_self">
<link rel="shortcut icon" href="https://gitee.com/ProgramCX/tzydhpics/raw/master/tczx.png" type="image/png">
</head>

<body>
<div id="cover">
<p>精彩即将呈现...</p>
</div>
<script src="jq.min.js"></script>

<!-- <audio src="music.m4a" id="audio" preload="none"></audio> -->
<!-- <audio src="https://downsc.chinaz.net/Files/DownLoad/sound1/201605/7324.mp3" -->
<!-- id="audio" preload="none"></audio> -->
<audio src="https://gitee.com/tzydh/tzydh/raw/main/music.m4a" id="audio" preload="none"></audio>
<div id="tit">
<div class="title">
<p id="topic">Loading...</p>
<a class="a btn" onclick="$('#sidebar').toggleClass('show');"><svg xmlns="http://www.w3.org/2000/svg"
width="16" height="16" fill="currentColor" class="bi bi-list" viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z" />
</svg></a>
</div>
<!-- <p>若某些图片加载失败，请右键图片点击加载映像以重新加载</p> -->
<div id="musctrl">
<p>🎵运动员进行曲</p>
<a onclick="if($(this).hasClass('play')){
document.getElementById('audio').play();
played=true;
$('#musctrl>.btn').text('暂停');
$('#musctrl>.btn').removeClass('play');
$('#music>.tip').text('我们已开始播放音乐');
$('#music>.btn').remove();
}else{
document.getElementById('audio').pause();
this.innerText='播放';
$(this).addClass('play')
}" class="play a btn" style="margin: 0 15px;">播放</a>
</div>
</div>
<div id="sidebar">
<div class="grid">
<a class="card enable" href="example.html?id=opencrmn" style="grid-column: 2 span;">
<p>开幕式</p>
</a>
<a class="card enable" href="example.html?id=volunteer">
<p>志愿服务</p>
</a>
<a class="card enable" style="grid-column: 2 span;" href="example.html?id=closecrmn">
<p>闭幕式</p>
</a>
<a class="card enable" href="example.html?id=4x100">
<p>4×100m</p>
</a>
<a class="card enable" href="example.html?id=100">
<p>100m</p>
</a>
<a class="card enable" href="example.html?id=200">
<p>200m</p>
</a>
<a class="card enable" href="example.html?id=400">
<p>400m</p>
</a>
<a class="card enable" href="example.html?id=800">
<p>800m</p>
</a>
<a class="card enable" href="example.html?id=1500">
<p>1500m</p>
</a>
<a class="card enable" href="example.html?id=3000">
<p>3000m</p>
</a>
<a class="card enable" href="example.html?id=shotput">
<p>铅球</p>
</a>
<a class="card enable" href="example.html?id=highjump">
<p>跳高</p>
</a>
<a class="card enable" style="grid-column: 2 span;" href="example.html?id=longjump">
<p>跳远&三级跳远</p>
</a>
<a class="card enable" href="example.html?id=schoolscene">
<p>学校风景</p>
</a>
<a class="card enable" href="example.html?id=relay">
<p>迎面接力</p>
</a>
</div>
</div>
<a class="a" id="totop" onclick="$('html')[0].scroll(0,0)">
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-chevron-bar-up" viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M3.646 11.854a.5.5 0 0 0 .708 0L8 8.207l3.646 3.647a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 0 0 0 .708zM2.4 5.2c0 .22.18.4.4.4h10.4a.4.4 0 0 0 0-.8H2.8a.4.4 0 0 0-.4.4z" />
</svg>
</a>
<script>
var r = window.location.search.substr(1).match(/(^|&)id=([^&]*)(&|$)/);
if (r != null) r = unescape(r[2])
else {
alert('一点小问题，不必介意，还请刷新试试');
}
$.getJSON(`pics/${r}.json`).then(res => {
$('#topic').text(res.title);
$('#title').text('天中运动会-' + res.title);
if(res.intro){
$('#content')[0].innerHTML += `<div class="text">
<p class="tit">${res.intro.tit}</p>
<p>${res.intro.cnt}</p>
</div>`;
}
res.pics.forEach(p => {
$('#content')[0].innerHTML += `<div class="pic af">
<p>加载中...</p>
<a href="${p.url}" class="link"><img src="${p.url}" class="pic" loading="lazy"></img></a>
<p class="desp">${p.dtl}</p>
</div>`;
});
$('#cover,html').addClass('load');
start();
}).fail(() => {
alert('一些小问题，不必介意，还请刷新试试');
});
</script>
<p id="tip" class="show">点击图片可单独浏览；点击左上三横按钮可切换体育项目。</p>
<div id="content">
<div id="music">
<p class="ti">奏乐~</p>
<p class="tip">下滑即意味着我们将趁浏览器不备时播放</p>
<a onclick="document.getElementById('audio').play();
played=true;
$('#musctrl>.btn').text('暂停');
$('#musctrl>.btn').removeClass('play');
$('#music>.tip').text('我们已开始播放音乐');
$('#music>.btn').remove();
localStorage.setItem('playm','true');" class="play a btn">默认播放</a>
<a class="a btn noplay" onclick="
document.getElementById('audio').pause();
playm=false;
$('#music>.btn').remove();
$('#music>.tip').text('我们不会播放音乐');
localStorage.setItem('playm','false');">从不播放</a>
</div>
</div>
<div id="footer">
网站制作（点击后面昵称可浏览个人主页）：<a class="a jump" target="_blank" href="https://tjy-gitnub.github.io/">星源</a><br>
项目策划、后期完善（点击后面昵称可浏览个人主页）：<a class="a jump" target="_blank" href="https://tjy-gitnub.github.io/">星源</a>、<a class="a jump" target="_blank" href="https://programcx.github.io/">Program</a><br>
联系邮箱：<a class="a jump" target="_blank" href="mailto:waterdroplab@outlook.com">WaterDropLab@outlook.com</a><br>
在此我们向为制作该次运动会相册网站提供照片的教师和学生表示感谢！
</div>
<script src="examp.js"></script>
</body>

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title id="title">精彩即将呈现...</title>
<link rel="stylesheet" href="examp.css">
<base target="_self">
<link rel="shortcut icon" href="https://gitee.com/ProgramCX/tzydhpics/raw/master/tczx.png" type="image/png">
</head>

<body>
<div id="cover">
<p>精彩即将呈现...</p>
</div>
<script src="jq.min.js"></script>

<!-- <audio src="music.m4a" id="audio" preload="none"></audio> -->
<!-- <audio src="https://downsc.chinaz.net/Files/DownLoad/sound1/201605/7324.mp3" -->
<!-- id="audio" preload="none"></audio> -->
<audio src="https://gitee.com/tzydh/tzydh/raw/main/music.m4a" id="audio" preload="none"></audio>
<div id="tit">
<div class="title">
<p id="topic">Loading...</p>
<a class="a btn" onclick="$('#sidebar').toggleClass('show');"><svg xmlns="http://www.w3.org/2000/svg"
width="16" height="16" fill="currentColor" class="bi bi-list" viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z" />
</svg></a>
</div>
<!-- <p>若某些图片加载失败，请右键图片点击加载映像以重新加载</p> -->
<div id="musctrl">
<p>🎵运动员进行曲</p>
<a onclick="if($(this).hasClass('play')){
document.getElementById('audio').play();
played=true;
$('#musctrl>.btn').text('暂停');
$('#musctrl>.btn').removeClass('play');
$('#music>.tip').text('我们已开始播放音乐');
$('#music>.btn').remove();
}else{
document.getElementById('audio').pause();
this.innerText='播放';
$(this).addClass('play')
}" class="play a btn" style="margin: 0 15px;">播放</a>
</div>
</div>
<div id="sidebar">
<div class="grid">
<a class="card enable" href="example.html?id=opencrmn" style="grid-column: 2 span;">
<p>开幕式</p>
</a>
<a class="card enable" href="example.html?id=volunteer">
<p>志愿服务</p>
</a>
<a class="card enable" style="grid-column: 2 span;" href="example.html?id=closecrmn">
<p>闭幕式</p>
</a>
<a class="card enable" href="example.html?id=4x100">
<p>4×100m</p>
</a>
<a class="card enable" href="example.html?id=100">
<p>100m</p>
</a>
<a class="card enable" href="example.html?id=200">
<p>200m</p>
</a>
<a class="card enable" href="example.html?id=400">
<p>400m</p>
</a>
<a class="card enable" href="example.html?id=800">
<p>800m</p>
</a>
<a class="card enable" href="example.html?id=1500">
<p>1500m</p>
</a>
<a class="card enable" href="example.html?id=3000">
<p>3000m</p>
</a>
<a class="card enable" href="example.html?id=shotput">
<p>铅球</p>
</a>
<a class="card enable" href="example.html?id=highjump">
<p>跳高</p>
</a>
<a class="card enable" style="grid-column: 2 span;" href="example.html?id=longjump">
<p>跳远&三级跳远</p>
</a>
<a class="card enable" href="example.html?id=schoolscene">
<p>学校风景</p>
</a>
<a class="card enable" href="example.html?id=relay">
<p>迎面接力</p>
</a>
</div>
</div>
<a class="a" id="totop" onclick="$('html')[0].scroll(0,0)">
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-chevron-bar-up" viewBox="0 0 16 16">
<path fill-rule="evenodd"
d="M3.646 11.854a.5.5 0 0 0 .708 0L8 8.207l3.646 3.647a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 0 0 0 .708zM2.4 5.2c0 .22.18.4.4.4h10.4a.4.4 0 0 0 0-.8H2.8a.4.4 0 0 0-.4.4z" />
</svg>
</a>
<script>
var r = window.location.search.substr(1).match(/(^|&)id=([^&]*)(&|$)/);
if (r != null) r = unescape(r[2])
else {
alert('一点小问题，不必介意，还请刷新试试');
}
$.getJSON(`pics/${r}.json`).then(res => {
$('#topic').text(res.title);
$('#title').text('天中运动会-' + res.title);
if(res.intro){
$('#content')[0].innerHTML += `<div class="text">
<p class="tit">${res.intro.tit}</p>
<p>${res.intro.cnt}</p>
</div>`;
}
res.pics.forEach(p => {
$('#content')[0].innerHTML += `<div class="pic af">
<p>加载中...</p>
<a href="${p.url}" class="link"><img src="${p.url}" class="pic" loading="lazy"></img></a>
<p class="desp">${p.dtl}</p>
</div>`;
});
$('#cover,html').addClass('load');
start();
}).fail(() => {
alert('一些小问题，不必介意，还请刷新试试');
});
</script>
<p id="tip" class="show">点击图片可单独浏览；点击左上三横按钮可切换体育项目。</p>
<div id="content">
<div id="music">
<p class="ti">奏乐~</p>
<p class="tip">下滑即意味着我们将趁浏览器不备时播放</p>
<a onclick="document.getElementById('audio').play();
played=true;
$('#musctrl>.btn').text('暂停');
$('#musctrl>.btn').removeClass('play');
$('#music>.tip').text('我们已开始播放音乐');
$('#music>.btn').remove();
localStorage.setItem('playm','true');" class="play a btn">默认播放</a>
<a class="a btn noplay" onclick="
document.getElementById('audio').pause();
playm=false;
$('#music>.btn').remove();
$('#music>.tip').text('我们不会播放音乐');
localStorage.setItem('playm','false');">从不播放</a>
</div>
</div>
<div id="footer">
网站制作：<a class="a jump" target="_blank" href="https://tjy-gitnub.github.io/">星源</a><br>
项目策划、后期完善：<a class="a jump" target="_blank" href="https://tjy-gitnub.github.io/">星源</a>、<a class="a jump" target="_blank" href="https://programcx.github.io/">Program</a><br>
联系邮箱：<a class="a jump" target="_blank" href="mailto:pinsoftstudio@outlook.com">PinsoftStudio@outlook.com</a><br>
在此我们向为制作该次运动会相册网站提供照片的教师和学生表示感谢！
</div>
<script src="examp.js"></script>
</body>

</html>
Loading

0 comments on commit 91bdb9a

Please sign in to comment.