轻量级网易云音乐迷你播放器 - 纯原生 JavaScript 实现
一个轻量级的网易云音乐迷你播放器库，使用纯原生 JavaScript 和 CSS 开发，基于NeteaseCloudMusicApi的网易云API二次开发
你可以选择本地引入或 CDN 引入：
<!-- 引入样式和脚本 -->
<link rel="stylesheet" href="netease-mini-player.css">
<script src="netease-mini-player.js"></script><!-- 引入样式和脚本 -->
<link rel="stylesheet" href="https://api.hypcvgm.top/NeteaseMiniPlayer/netease-mini-player.css">
<script src="https://api.hypcvgm.top/NeteaseMiniPlayer/netease-mini-player.js"></script><!-- 基础用法 -->
<div class="netease-player"
data-playlist-id="14273792576"></div>
<!-- 完整配置 -->
<div class="netease-player"
data-playlist-id="14273792576"
data-position="bottom-right"
data-embedded="false"></div>播放器支持两种模式：页面模式 和 嵌入模式，通过 data-embedded 属性控制。
<div class="netease-player"
data-playlist-id="14273792576"
data-embedded="false"></div><div class="netease-player"
data-playlist-id="14273792576"
data-embedded="true"></div>页面模式下，通过 data-position 属性可以设置播放器在页面中的固定位置：
top-left
top-center
top-right
bottom-left
bottom-center
bottom-right
<!-- 示例：左上角位置 -->
<div class="netease-player"
data-playlist-id="14273792576"
data-position="top-left"></div>采用现代拟态化（Neumorphism）设计风格，视觉效果精美
完美适配各种屏幕尺寸，从桌面到移动设备
支持播放/暂停、进度控制、音量调节等全功能
支持原文歌词和翻译歌词同时显示
支持自动下一首、播放列表循环播放
音频 URL 智能缓存，减少网络请求
支持页面模式和嵌入模式，适应不同使用场景
纯原生实现，文件小巧，加载速度快
<div class="netease-player"
data-playlist-id="歌单ID"
data-position="位置"
data-embedded="嵌入模式"></div>// 获取所有播放器实例
const players = window.NeteaseMiniPlayer.instances;
// 重新初始化所有播放器
window.NeteaseMiniPlayer.init();
// 销毁所有播放器
window.NeteaseMiniPlayer.destroy();
// 获取特定播放器实例
const playerElement = document.querySelector('.netease-player');
const player = window.NeteaseMiniPlayer.instances.get(playerElement);
// 播放器控制方法
if (player) {
player.play(); // 播放
player.pause(); // 暂停
player.next(); // 下一首
player.prev(); // 上一首
player.setVolume(0.5); // 设置音量 (0-1)
}<!-- 页面模式，右下角，可缩小 -->
<div class="netease-player"
data-playlist-id="14273792576"
data-position="bottom-right"
data-embedded="false"></div><!-- 嵌入模式，融入页面内容 -->
<div class="netease-player"
data-playlist-id="14273792576"
data-embedded="true"></div><!-- 不同歌单的多个播放器 -->
<div class="netease-player"
data-playlist-id="14273792576"
data-position="top-left"></div>
<div class="netease-player"
data-playlist-id="另一个歌单ID"
data-position="bottom-right"></div>