feat(music): 实现黑胶唱片播放器与歌词同步功能
- 重构黑胶唱片样式,添加旋转动画与脉冲波效果 - 移除机械臂元素,改用点击唱片控制播放/暂停 - 新增歌词显示区域,实现歌词随播放进度高亮 - 解析并加载 LRC 歌词文件,支持异步获取远程歌词 - 使用 requestAnimationFrame 实现高性能歌词滚动 - 更新移动端悬浮按钮状态以反映音乐播放状态 - 简化主题判断逻辑,优化语言切换功能 - 隐藏 APlayer 默认界面,保留核心音频控制功能
This commit is contained in:
@@ -196,11 +196,9 @@
|
||||
</div>
|
||||
<div class="vinyl-player">
|
||||
<div class="vinyl-disc" id="vinyl-disc"></div>
|
||||
<div class="vinyl-arm"></div>
|
||||
<div class="vinyl-info">
|
||||
<span class="vinyl-title" data-i18n="music.playlist">My Playlist</span>
|
||||
<button id="music-toggle" class="link-btn" aria-label="Toggle Music">Play</button>
|
||||
<span id="music-status" class="vinyl-status" style="display:none;" data-i18n="music.unavailable">Player under maintenance</span>
|
||||
<span id="music-status" class="vinyl-status" style="display:none;" data-i18n="music.unavailable">Player under maintenance</span>
|
||||
<div class="vinyl-lyrics" id="vinyl-lyrics">
|
||||
<div id="lyric-current">--</div>
|
||||
</div>
|
||||
<div id="aplayer" class="aplayer" style="flex:1;"></div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user