HTML5背景音乐的暂停与播放
2016-03-22 13:29
621 查看
HTML代码:
<audio id="myaudio" loop="loop" preload="auto" autoplay="autoplay">
<source src="music/纯音乐%20-%20在那遥远的地方%20-%20纯音乐版.mp3" type="audio/ogg" />
<source src="music/纯音乐%20-%20在那遥远的地方%20-%20纯音乐版.mp3" type="audio/mp3" />
</audio>
<img onclick="swap_music()" src="/images/icon_music.png" style="height:30px; vertical-align:middle;" />
JS代码:
//背景音乐停止与播放
function swap_music() {
var oAudio = document.getElementById('myaudio');
if (oAudio.paused) {
oAudio.play();
}
else {
oAudio.pause();
}
}
<audio id="myaudio" loop="loop" preload="auto" autoplay="autoplay">
<source src="music/纯音乐%20-%20在那遥远的地方%20-%20纯音乐版.mp3" type="audio/ogg" />
<source src="music/纯音乐%20-%20在那遥远的地方%20-%20纯音乐版.mp3" type="audio/mp3" />
</audio>
<img onclick="swap_music()" src="/images/icon_music.png" style="height:30px; vertical-align:middle;" />
JS代码:
//背景音乐停止与播放
function swap_music() {
var oAudio = document.getElementById('myaudio');
if (oAudio.paused) {
oAudio.play();
}
else {
oAudio.pause();
}
}
相关文章推荐
- 详解如何用HTML5 Canvas API控制图片的缩放变换
- 实例讲解利用HTML5 Canvas API操作图形旋转的方法
- 详解通过HTML5 Canvas实现图片的平移及旋转变化的方法
- 使用HTML5 Canvas绘制圆角矩形及相关的一些应用举例
- 使用HTML5 Canvas API绘制弧线的教程
- Cross-Origin Resource Sharing协议介绍
- ajax与HTML5 history pushState/replaceState实例
- HTML5新增元素全解析
- html5 web storage 存储
- 安卓手机访问h5页面的input,弹出软键盘遮挡input
- HTML5- Canvas入门(一)
- 【HTML5】H5的新标签简介
- 再次推荐一款逼真的HTML5下雪效果
- 用HTML5新标签构建页面
- HTML5常用标签
- HTML5之video元素
- HTML5与CSS3基础教程第八版学习笔记11~15章
- H5 - HTML5新增标签
- HTML5 页面跳转和参数传递
- HTML5 元素