yuxing/purposed_apps
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Delete 课堂随机点名v1.1.html

Browse Source
This commit is contained in:
yuxing
2025-04-27 08:58:19 +08:00
parent 3a2026b561
commit dd6bf81815
1 changed files with 0 additions and 215 deletions
Download Patch File Download Diff File Expand all files Collapse all files

215
课堂随机点名v1.1.html
View File

@@ -1,215 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>课堂随机点名系统</title>
<style>
body {
margin: 0;
padding: 20px;
background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);
font-family: 'Comic Sans MS', cursive;
min-height: 100vh;
}
.container {
max-width: 800px;
margin: 0 auto;
text-align: center;
}
#title {
color: #6a1b9a;
font-size: 2.5em;
text-shadow: 2px 2px 4px rgba(0,0,0,0.2);
margin-bottom: 30px;
}
#display {
height: 200px;
background: rgba(255,255,255,0.9);
border-radius: 20px;
box-shadow: 0 8px 16px rgba(0,0,0,0.2);
margin: 20px 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 2.2em;
color: #2c3e50;
transition: all 0.3s ease;
flex-direction: row;
gap: 20px;
white-space: nowrap;
padding: 0 20px;
overflow-x: auto;
}
.controls {
display: flex;
flex-direction: column;
gap: 15px;
align-items: center;
}
button {
padding: 12px 30px;
font-size: 1.2em;
border: none;
border-radius: 25px;
background: #3498db;
color: white;
cursor: pointer;
transition: transform 0.2s;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
button:hover {
transform: translateY(-2px);
background: #2980b9;
}
#speedControl {
width: 200px;
margin: 10px 0;
}
.highlight {
background-color: #f1c40f !important;
color: #c0392b !important;
transform: scale(1.1);
}
.student-id {
font-size: 0.8em;
color: #6a1b9a;
font-weight: bold;
}
.pinyin {
font-size: 0.6em;
color: #7f8c8d;
font-style: italic;
}
@media (max-width: 480px) {
#display {
font-size: 1.8em;
gap: 10px;
}
}
</style>
</head>
<body>
<div class="container">
<h1 id="title">杨老师的点名利器</h1>
<div id="display">点击开始</div>
<div class="controls">
<input type="range" id="speedControl" min="1" max="10" value="5">
<button onclick="toggleRoll()">开始点名</button>
</div>
</div>
<script>
let names = [
{ id: "3226217014", name: "林德豪", pinyin: "Lín Démáo" },
{ id: "3226217022", name: "吴凯岚", pinyin: "Wú Kǎilán" },
{ id: "3226217023", name: "曹庆凯", pinyin: "Cáo Qìngkǎi" },
{ id: "3226217041", name: "黄翔", pinyin: "Huáng Xiáng" },
{ id: "3226217049", name: "乐权", pinyin: "Lè Quán" },
{ id: "3226217051", name: "李雅珍", pinyin: "Lǐ Yāzhēn" },
{ id: "3226217053", name: "汤子怡", pinyin: "Tāng Zǐyí" },
{ id: "3226217056", name: "黄威龙", pinyin: "Huáng Wēilóng" },
{ id: "3226217060", name: "蔡文杰", pinyin: "Cài Wénjié" },
{ id: "3226217061", name: "刘恩杰", pinyin: "Liú Ēnjié" },
{ id: "3226217064", name: "苏明坤", pinyin: "Sū Míngkūn" },
{ id: "3226217066", name: "田昱泽", pinyin: "Tián Yùzé" },
{ id: "3226217067", name: "郑文煊", pinyin: "Zhèng Wénxuān" },
{ id: "3226217072", name: "张铖", pinyin: "Zhāng Chéng" },
{ id: "3226217073", name: "王景东", pinyin: "Wáng Jǐngdōng" },
{ id: "3226217075", name: "魏卿", pinyin: "Wèi Qīng" },
{ id: "3226217076", name: "侯俊伟", pinyin: "Hóu Jùnwěi" },
{ id: "3226217077", name: "余晶烨", pinyin: "Yú Jīngyè" },
{ id: "3226217085", name: "林书凡", pinyin: "Lín Shūfán" },
{ id: "3226217086", name: "王一超", pinyin: "Wáng Yīchāo" },
{ id: "3226217088", name: "王闻松", pinyin: "Wáng Wénsōng" },
{ id: "3226217093", name: "谭吉宇", pinyin: "Tán Jíyǔ" },
{ id: "3226217094", name: "江续欣", pinyin: "Jiāng Xùxīn" },
{ id: "3226217096", name: "陈敏清", pinyin: "Chén Mǐnqīng" },
{ id: "3226217098", name: "刘静", pinyin: "Liú Jìng" },
{ id: "3226217100", name: "叶鸿杰", pinyin: "Yè Hóngjié" },
{ id: "3226217101", name: "王子文", pinyin: "Wáng Zǐwén" },
{ id: "3226217102", name: "任思佳", pinyin: "Rèn Sījiā" },
{ id: "3226217104", name: "林星宇", pinyin: "Lín Xīngyǔ" },
{ id: "3226217107", name: "杨林", pinyin: "Yáng Lín" },
{ id: "3226217108", name: "黄宇翔", pinyin: "Huáng Yǔxiáng" },
{ id: "3226217112", name: "刘承风", pinyin: "Liú Chéngfēng" },
{ id: "3226217116", name: "陈金泉", pinyin: "Chén Jīnquán" },
{ id: "3226217118", name: "赵邦超", pinyin: "Zhào Bāngchāo" },
{ id: "3226217120", name: "林宇彬", pinyin: "Lín Yǔbīn" },
{ id: "3226217124", name: "官崇桢", pinyin: "Guān Chóngzhēn" },
{ id: "3226217126", name: "谢林强", pinyin: "Xiè Línqiáng" },
{ id: "3226217132", name: "包长滨", pinyin: "Bāo Chángbīn" },
{ id: "3226217133", name: "徐晴", pinyin: "Xú Qíng" },
{ id: "3226217136", name: "林梓豪", pinyin: "Lín Zǐháo" },
{ id: "3226217140", name: "杨雨冰", pinyin: "Yáng Yǔbīng" },
{ id: "3226217141", name: "唐余婷", pinyin: "Táng Yútíng" },
{ id: "3226217143", name: "苏锦标", pinyin: "Sū Jǐngbiāo" },
{ id: "3226217144", name: "赖延宏", pinyin: "Lài Yánhóng" },
{ id: "3226217154", name: "邹竞超", pinyin: "Zōu Jìngchāo" },
{ id: "3226217156", name: "雷宇龙", pinyin: "Léi Yǔlóng" },
{ id: "3226217163", name: "曾嘉鹏", pinyin: "Zēng Jiāpéng" },
{ id: "3226217165", name: "廖才新", pinyin: "Liào Cáixīn" },
{ id: "3226217167", name: "刘源", pinyin: "Liú Yuán" },
{ id: "3226217168", name: "林历新", pinyin: "Lín Lìxīn" },
{ id: "3226217170", name: "俞建曦", pinyin: "Yú Jiànxī" }
];
let isRolling = false;
let intervalId;
let currentStudent = null;
const display = document.getElementById('display');
const speedControl = document.getElementById('speedControl');
// 设置自定义标题
const customTitle = prompt("请输入课堂名称：") || "魔法课堂";
document.getElementById('title').textContent = `${customTitle}点名系统`;
function toggleRoll() {
if (!isRolling) {
startRoll();
} else {
stopRoll();
}
}
function startRoll() {
isRolling = true;
document.querySelector('button').textContent = "暂停点名";
const speed = 100 - (speedControl.value * 8);
intervalId = setInterval(() => {
currentStudent = names[Math.floor(Math.random() * names.length)];
display.innerHTML = `
<span class="student-id">${currentStudent.id}</span>
<span>${currentStudent.name}</span>
<span class="pinyin">(${currentStudent.pinyin})</span>
`;
}, speed);
}
function stopRoll() {
isRolling = false;
clearInterval(intervalId);
document.querySelector('button').textContent = "开始点名";
display.classList.add('highlight');
setTimeout(() => display.classList.remove('highlight'), 2000);
}
speedControl.addEventListener('input', () => {
if (isRolling) {
clearInterval(intervalId);
startRoll();
}
});
</script>
</body>
</html>