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

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

jQuery将HTML5的audio标签打造为web音频播放器-极客公园

前言

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>

相关链接

下载地址 效果预览

-- 完 --

发表评论

电子邮件地址不会被公开。 必填项已用*标注