'commit'
This commit is contained in:
@@ -230,12 +230,44 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
@keyframes spin {
|
@keyframes spin {
|
||||||
0% {
|
0% { transform: rotate(0deg); }
|
||||||
transform: rotate(0deg);
|
100% { transform: rotate(360deg); }
|
||||||
}
|
}
|
||||||
100% {
|
|
||||||
transform: rotate(360deg);
|
/* 图片模态框样式 */
|
||||||
|
.modal {
|
||||||
|
display: none; /* 默认隐藏 */
|
||||||
|
position: fixed;
|
||||||
|
z-index: 1001; /* 确保在加载动画之上 */
|
||||||
|
padding-top: 50px;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
background-color: rgba(0,0,0,0.9);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.modal-content {
|
||||||
|
margin: auto;
|
||||||
|
display: block;
|
||||||
|
max-width: 80%;
|
||||||
|
max-height: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.close-btn {
|
||||||
|
position: absolute;
|
||||||
|
top: 20px;
|
||||||
|
right: 35px;
|
||||||
|
color: white;
|
||||||
|
font-size: 40px;
|
||||||
|
font-weight: bold;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.close-btn:hover {
|
||||||
|
color: #bbb;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
@@ -254,7 +286,7 @@
|
|||||||
<h2>示例公式图片</h2>
|
<h2>示例公式图片</h2>
|
||||||
<div class="example-images">
|
<div class="example-images">
|
||||||
<div class="example-image-card">
|
<div class="example-image-card">
|
||||||
<img src="https://dsideal.obs.cn-north-1.myhuaweicloud.com/HuangHai/Backup/GongShi.jpg" alt="公式示例1">
|
<img src="https://dsideal.obs.cn-north-1.myhuaweicloud.com/HuangHai/Backup/GongShi.jpg" alt="公式示例1" onclick="openModal(this.src)">
|
||||||
<div class="description">数学公式示例</div>
|
<div class="description">数学公式示例</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -280,7 +312,7 @@
|
|||||||
<h2>示例试题图片</h2>
|
<h2>示例试题图片</h2>
|
||||||
<div class="example-images">
|
<div class="example-images">
|
||||||
<div class="example-image-card">
|
<div class="example-image-card">
|
||||||
<img src="https://dsideal.obs.cn-north-1.myhuaweicloud.com/HuangHai/Backup/ShiTi.jpg" alt="试题示例1">
|
<img src="https://dsideal.obs.cn-north-1.myhuaweicloud.com/HuangHai/Backup/ShiTi.jpg" alt="试题示例1" onclick="openModal(this.src)">
|
||||||
<div class="description">试题示例</div>
|
<div class="description">试题示例</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -299,8 +331,16 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- 图片查看模态框 -->
|
||||||
|
<div id="imageModal" class="modal">
|
||||||
|
<span class="close-btn" onclick="closeModal()">×</span>
|
||||||
|
<img class="modal-content" id="modalImage">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// MathJax 配置
|
// MathJax 配置
|
||||||
window.MathJax = {
|
window.MathJax = {
|
||||||
@@ -479,6 +519,16 @@
|
|||||||
div.textContent = text;
|
div.textContent = text;
|
||||||
return div.innerHTML;
|
return div.innerHTML;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 图片模态框控制函数
|
||||||
|
function openModal(imageSrc) {
|
||||||
|
const modal = document.getElementById('imageModal');
|
||||||
|
const modalImg = document.getElementById('modalImage');
|
||||||
|
modal.style.display = 'block';
|
||||||
|
modalImg.src = imageSrc;
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeModal() {
|
||||||
|
document.getElementById('imageModal').style.display = 'none';
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
</body>
|
|
||||||
</html>
|
|
Reference in New Issue
Block a user