添加音频元素、 设置的属性,你需要和添加源。您将添加更多不同的来源,更多的用户将能够听听您的音频 (因为没有一个音频格式跨所有浏览器支持)。三个例子:
<audio src="audio.wav" preload="auto" controls></audio>
这只是将预加载audio.wav文件并不会发挥它直到用户单击播放按钮。nonemetadata) 的其他preload值将不预加载该文件。
autoplay时它会加载该文件,然后再loop它以这种方式:
指定多个音频格式来解决前面提到的问题:
<audio preload="auto" controls>
<source src="audio.wav" />
<source src="audio.mp3" />
<source src="audio.ogg" />
</audio>
神秘controls吗?它是一个布尔属性不会影响任何方式中的插件,但可确保该浏览器的默认播放器是显示和禁用 JavaScript 时显示控件与控件。
最后一步 ― 调用插件
<audio src="audio.wav" preload="auto" controls></audio>
<script src="jquery.js"></script>
<script src="audioplayer.js"></script>
<script>
$( function()
{
$( 'audio' ).audioPlayer()
})
</script>
该插件,一些可选的参数。最重要的一个被称为classPrefix。传递的值成为子元素的父元素和类名称前缀的类名称。其他选项只可能有利英语以外的语言。具有默认值的示例:
$( 'audio' ).audioPlayer(
{
classPrefix: 'audioplayer',
strPlay: 'Play',
strPause: 'Pause',
strVolume: 'Volume'
})
有一些类的名称,被分配到父元素时:
音乐播放器版本― ― 正在播放音频
<div class="audioplayer audioplayer-playing">
停止停止音乐播放器版本― ― 音频
<div class="audioplayer audioplayer-stopped">
音乐播放器版本静音― ― 卷处于静音状态
<div class="audioplayer audioplayer-muted">
音乐播放器版本 novolume ― ― 没有音量调节是可用的:
<div class="audioplayer audioplayer-novolume">
重要提示:时不支持音频元素或没有任何给定的音频文件是与浏览器兼容,玩家切换到迷你模式,基本上减少了播放机播放/暂停按钮 (因为"嵌入"元素是有限的 *** 作):
<div class="audioplayer audioplayer-stopped audioplayer-mini">
<embed src="audio.wav" width="0" height="0" volume="100" autostart="false" loop="false" />
<div class="audioplayer-playpause" title="Play"><a href="#">Play</a></div>
</div>
可以使用html5的audio标签来添加音乐播放器<audio controls>
type:指定文件类型
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
</audio>
对应的参数属性如下图:
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<title>播放器</title>
<style>
</style>
</head>
<body>
<audio id="music01" src="G.E.M.邓紫棋 - 红蔷薇白玫瑰.mp3" loop="loop">你的浏览器不支持audio标签。</audio>
<a href="javascript:playPause()"><img src="1.jpg" width="50" height="50" id="music_btn01" border="0"></a>
</body>
<script>
function playPause() {
var music = document.getElementById('music01')
var music_btn = document.getElementById('music_btn01')
if (music.paused){
music.play()
music_btn.src = '1.jpg' //播放图片
}
else{
music.pause()
music_btn.src = '1.jpg' //暂停图片
}
}
</script>
</html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)