HTML5背景音乐的暂停与播放
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();
}
}
HTML5背景音乐的暂停与播放的更多相关文章
- html5 audio的暂停与播放
在html5里,audio是新增的功能.它方便了用户. 大多数音频是通过插件(比如 Flash)来播放的.然而,并非所有浏览器都拥有同样的插件. HTML5 规定了一种通过 audio 元素来包含音频 ...
- js控制html5 audio的暂停、播放、停止
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name ...
- 31.JS实现控制HTML5背景音乐播放暂停
实现控制网站背景音乐的播放暂停在html5中是非常容易和简单的,仅仅几行代码即可实现.首先在网页中嵌入背景音乐,html5代码为: <script src="http://wuover ...
- HTML5 audio标签自制音乐播放器
相关技能 HTML5+CSS3(实现页面布局和动态效果) Iconfont(使用矢量图标库添加播放器相关图标) LESS (动态CSS编写) jQuery(快速编写js脚本) gulp+webpack ...
- [转载]html5直接在网页上播放视频音频兼容所有浏览器
文章给大家分享一个html5直接在网页上播放视频兼容所有浏览器,有需要的同学可参考. HTML5可以用video标签来播放视频 当前,video 元素支持三种视频格式: 格式 IE Firefox O ...
- 谈谈一些有趣的CSS题目(十四)-- 纯 CSS 方式实现 CSS 动画的暂停与播放!
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
- 解决html5中video标签无法播放mp4问题的办法
这篇文章主要给大家介绍了关于解决html5中video标签无法播放mp4问题的办法,文中介绍的非常详细,相信会对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面来一起看看吧. 最近发现了一个 ...
- CEF3 HTML5 audio标签为什么不能播放mp3格式的音频文件
CEF3 HTML5 audio标签 为什么不能播放mp3格式的音频文件 原因略. 解决方法: 找一个最新版的chrome ,我用的是24版本.路径 C:\Documents and Sett ...
- 纯 CSS 方式实现 CSS 动画的暂停与播放!
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
随机推荐
- Excel中R1C1引用样式
在Excel处理中,经常需要修改某行某列的值.默认情况下Excel中的列号是字母,每次都要去数,因为对字母的位置不熟悉,特别是又有合并单元格的时候,很容易数错.能不能把列也显示成数字,我坚信Offic ...
- 使用sigc++插槽系统
http://www.cppblog.com/gaimor/archive/2010/02/22/108236.html?opt=admin 我所知的c++插槽系统由3个boost的,sigslot的 ...
- 【.NET中AOP的实现方案】静态代理
Spring AOP 应该是比较出名的了,今天说的是C#里的AOP,C#的AOP实现的方式有很多种,现在就先介绍静态代理的实现方案: 模拟场景:我们在删除用户,或者更新用户的时候进行数据原始备份,这样 ...
- 嵌入式Linux的web视频服务器的构建
http://blog.sina.com.cn/s/blog_53d02d550102v8bu.html随着嵌入式处理器和开源Linux 的广泛应用,各种视频服务在嵌入式系统中逐渐发展起来. 1.引言 ...
- 线性表 顺序存储 链式存储 ---java实现
首先抽象出一个线性表抽象类(包括主要的增删操作) public abstract class MyAbstractList<E> { public abstract void add(E ...
- win10 切换 简体/繁体中文
- 如何固定OpenERP顶的主菜单,方便滚动至第二屏以及多屏时,快速切换主菜单
如何固定OpenERP顶的主菜单,方便滚动至第二屏以及多屏时,快速切换主菜单 作者:广州-步科,来自OpenERP应用群() 将“addons\web\static\src\css”目录下的“base ...
- MVC时间对比及时间范围判断
方法一:使用DateTime.Compare 方法 public static int Compare( DateTime t1, DateTime t2 ) t1 早于 t2:小于零t1 与 t2 ...
- Python之zip
# -*- coding: utf-8 -*- #python 27 #xiaodeng #Python之zip #http://python.jobbole.com/82590/ #1)zip语法格 ...
- demo02
class PhoneNumber(): def __init__(self,number): self.a=number[1:4] self.b=number[6:9] self.c=number[ ...