进来白嫖，网页端音乐播放器，即拿即用
## 简介这是一个轻量级的网页音乐播放器插件，可以固定在页面底部，提供基本的音乐播放控制功能。播放器具有美观的UI设计，支持响应式布局，适合集成到各种网页项目中。
## 功能特性
- 🎵 播放/暂停、上一首、下一首控制
- ⏳ 进度条显示和拖动控制
- 🔊 音量调节
- 📋 播放列表选择
- 🎨 美观的渐变UI设计
- 📱 移动设备适配
- 🚀 简单的API接口
## 安装使用
1. 将 `server_music_player.js` 文件引入到你的网页中：
```html
<script src="https://craftblockht6x.github.io/server_music_player.js"></script>
```
2. 确保页面加载了Font Awesome图标库（插件会自动添加）
3. 初始化播放列表：
```javascript
// 设置播放列表
window.serverMusicList = [
{
name: "歌曲名称",
artist: "艺术家",
url: "音乐文件URL"
},
// 更多歌曲...
];
// 或者使用API设置
ServerMusicPlayer.setPlaylist([
{
name: "另一首歌",
artist: "另一位艺术家",
url: "音乐文件URL"
}
]);
```
## API接口
插件提供了一个简单的API接口：
```javascript
// 设置播放列表
ServerMusicPlayer.setPlaylist([
{
name: "歌曲名称",// 必填
artist: "艺术家",// 必填
url: "音乐文件URL" // 必填
}
]);
```
## 自定义样式
播放器的所有样式都封装在 `.server_music_player` 命名空间下，你可以通过CSS覆盖默认样式来自定义外观。
## 浏览器支持
- 现代浏览器（Chrome, Firefox, Safari, Edge）
- 移动端浏览器
## 注意事项
1. 确保音乐文件URL是可访问的
2. 播放器默认使用Font Awesome 6图标，需要网络连接
3. 如需离线使用，请自行引入Font Awesome
## 示例
```html
<!DOCTYPE html>
<html>
<head>
<title>音乐播放器示例</title>
<script src="server_music_player.js"></script>
</head>
<body>
<script>
// 设置播放列表
ServerMusicPlayer.setPlaylist([
{
name: "示例歌曲",
artist: "示例艺术家",
url: "https://example.com/music.mp3"
}
]);
</script>
</body>
</html>
```
页: [1]