A1300399510/PC-official
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: 添加悬停动画效果并优化音频播放逻辑

Browse Source 
为多个元素添加悬停动画效果，提升用户体验
重构音频播放逻辑，增加judgmentPlayUrl方法统一处理播放
更新HTML元数据，优化SEO和移动端适配
修改部分文案内容
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-09-25 15:34:07 +08:00
parent c5abafdc86
commit 523547871e
4 changed files with 105 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
static/css/index.css
View File

@@ -532,6 +532,12 @@
background-color: #000000;
border-radius: 0 10px 10px 0;
}
.content .works .audio-box .item .content .info .operate {
transition: all 0.3s ease-in-out;
}
.content .works .audio-box .item .content .info .operate > img:hover {
transform: scale(1.1);
}
.content .works .audio-box .item .content .info .operate .speed {
width: 16px;
height: 12px;
@@ -646,6 +652,12 @@
background-color: #000000;
border-radius: 0 10px 10px 0;
}
.content .custom .list .item .info .operate {
transition: all 0.3s ease-in-out;
}
.content .custom .list .item .info .operate > img:hover {
transform: scale(1.1);
}
.content .custom .list .item .info .operate .speed {
width: 16px;
height: 12px;
@@ -661,6 +673,10 @@
width: 240px;
height: 240px;
filter: drop-shadow(5px 5px 2.5px rgba(0, 0, 0, 0.35));
transition: all 0.3s ease-in-out;
}
.content .custom .list .item .info-img:hover {
transform: scale(1.05);
}
.content .custom .bottom {
position: absolute;
@@ -703,6 +719,9 @@
cursor: pointer;
transition: all 0.3s ease-in-out;
}
.content .student .student-box .list .img:hover {
transform: scale(1.1);
}
.content .student .student-box .list .img.img5 {
left: 0;
z-index: 2;
@@ -792,6 +811,12 @@
background-color: #ffffff;
border-radius: 0 10px 10px 0;
}
.content .student .student-box .operate {
transition: all 0.3s ease-in-out;
}
.content .student .student-box .operate > img:hover {
transform: scale(1.1);
}
.content .student .student-box .operate .cut {
width: 14px;
height: 12px;

25
static/css/index.less
View File

@@ -470,7 +470,6 @@
height: 100%;
border-radius: 10px;
transition: all 0.3s ease-in-out;
}
.play {
@@ -614,6 +613,11 @@
}
.operate {
transition: all 0.3s ease-in-out;
> img:hover {
transform: scale(1.1);
}
.speed {
width: 16px;
height: 12px;
@@ -748,6 +752,12 @@
}
.operate {
transition: all 0.3s ease-in-out;
> img:hover {
transform: scale(1.1);
}
.speed {
width: 16px;
height: 12px;
@@ -767,6 +777,11 @@
width: 240px;
height: 240px;
filter: drop-shadow(5px 5px 2.5px rgba(0, 0, 0, 0.35));
transition: all 0.3s ease-in-out;
&:hover {
transform: scale(1.05);
}
}
}
}
@@ -815,6 +830,10 @@
cursor: pointer;
transition: all 0.3s ease-in-out;
&:hover {
transform: scale(1.1);
}
&.img5 {
left: 0;
z-index: 2;
@@ -922,6 +941,10 @@
}
.operate {
transition: all 0.3s ease-in-out;
> img:hover {
transform: scale(1.1);
}
.cut {
width: 14px;
height: 12px;