jQuery将HTML5的audio标签打造为web音频播放器

HTML5 的 audio 标签大家都知道，可以在线播放音乐，今天云落推荐的是一个增强 audio 标签的 jQuery

前言

HTML5 的 audio 是云落经常使用的，因为云落觉得吧，在线播放个音乐没必要用啥其他的，但是也有人会觉得这个标签不咋样，那么今天云落就推荐一个简单的 jQuery 来美化下 audio

使用 jQuery

audioplay 是一个 jQuery 插件，所以引用 jQuery 是必须的，但是考虑到绝大多数 WordPress 已经引入了 jQuery，所以这一步骤其实差不多是可以不必的

<script src="//upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.3.min.js"></script>

然后在网页头部引入样式文件

<link rel="stylesheet" href="audioplayer.css" />

然后网页底部引入相关 jQuery 文件

<script src="audioplayer.min.js"></script>

还需要对他进行个初始化操作

			<script>
			$(function() {
				$('audio').audioPlayer();
			});
			</script>

这些差不多了，这次可以直接使用 HTML5 的 audio 了

<audio preload="auto" controls>
	<source src="audio/song.mp3">
	<source src="audio/song.ogg">
</audio>

相关链接

下载地址 效果预览

扫码订阅，第一时间获得更新

微信扫码二维码，订阅我们网站的动态，另外不定时发送 WordPress 小技巧，你可以随时退订，欢迎订阅哦~