html5 背景音乐 js控制播放 暂停
<html>
<head>
<title>
测试页面
</title>
<script src="jquery.min.js"></script><!--没有试用jquery,没有用,我用的是getElementById-->
</head>
<body>
<script type="text/javascript"></script>
<audio src="123.mp3" controls="controls" id="music1" autoplay>
</audio>
<input type="button" value="咳咳" onclick="bofang()">
<script>
function bofang(){
var audio = document.getElementById('music1');
if(audio!==null){//判断是否获得
if(audio.paused){//获得播放状态,这个属性应该是是否是暂停状态,如果是就播放,如果不是暂停就暂停
audio.play();
}else{
audio.pause();
}
}
}
</script>
</body>
</html>
audio标签的属性解释
| autoplay属性名 | autoplay值 | 如果出现该属性,则音频在就绪后马上播放。 |
| controls | controls | 如果出现该属性,则向用户显示控件,比如播放按钮。 |
| loop | loop | 如果出现该属性,则每当音频结束时重新开始播放。 |
| preload | preload |
如果出现该属性,则音频在页面加载时进行加载,并预备播放。 如果使用 "autoplay",则忽略该属性。 |
| src | url | 要播放的音频的 URL。 |
html5 背景音乐 js控制播放 暂停的更多相关文章
- duilib 增加gif控件(基于gdi+,可控制播放暂停,自动设置大小)
转载请说明原出处,谢谢~~:http://blog.csdn.net/zhuhongshu/article/details/42502081 因为项目需要我需要给duilib增加一个gif控件,目前已 ...
- 用JS控制video暂停再播放
模块就是用来进行封装,进行高内聚 低耦合的功能.其实各人认为ng2 的模块和.net的工程类似,如果要使用模块中定义的功能,第一步就是必须要引用它,ng2 中叫import 导入.那么我们看模块是否有 ...
- 31.JS实现控制HTML5背景音乐播放暂停
实现控制网站背景音乐的播放暂停在html5中是非常容易和简单的,仅仅几行代码即可实现.首先在网页中嵌入背景音乐,html5代码为: <script src="http://wuover ...
- js控制html5 audio的暂停、播放、停止
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name ...
- HTML5背景音乐的暂停与播放
HTML代码: <audio id="myaudio" loop="loop" preload="auto" autoplay ...
- js控制html5 【video】标签中视频的播放和停止
需求:页面中有2个普通按钮a,b.还有一个video标签,能成功播放出视频..我想要的效果是,点击a按钮,视频开始播放,点击b按钮,视频播放停止!!!<br><br>----- ...
- HTML5 - 使用JavaScript控制<audio>音频的播放
有时我们需要使用js来控制播放器实现音乐的播放,暂停.或者使用js播放一些音效. 1,通过JavaScript控制页面上的播放器 比如把页面上添加一个<audio>用来播放背景音乐(由 ...
- HTML5使用JavaScript控制<audio>音频的播放
1.播放音乐最简单的样例 <audio controls> <source src="horse.mp3" type="audio/mpeg" ...
- Cocos2d-x中背景音乐播放暂停与继续
背景音乐播放暂停与继续似乎我们很少使用,事实上也正是如此,背景音乐播放暂停与继续实例代码如下: SimpleAudioEngine::getInstance()->pauseBackground ...
随机推荐
- ubuntu搭建交叉编译环境makeinfo: command not found
解决办法:sudo apt-get install texinfo
- arm-linux-gcc 命令未找到问题
解决方法: 1.先打开一个超级用户权限的shell: 命令: ubuntu :sudo –s centos :su - 2.在当前shell下,设置环境变量: 命令:gedit /etc/profil ...
- 【习题 7-8 UVA-12107】Digit Puzzle
[链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 迭代加深搜索. 枚举最大层数.(也即改变的数字个数 然后枚举第一个改哪个数字,第二个改哪个数字.. 一定要注意字典序问题. 每次优先 ...
- 洛谷 P2067 Cytus-Holyknight
P2067 Cytus-Holyknight 题目背景 本人最初作 以此纪念伟大的ios.安卓.PSV平台音乐游戏<cytus> 后续将不断更新. -------------Chapter ...
- golang matrix
package main import ( "fmt" "go.matrix-go1" //比较有名的关于Matrix在golang中的方法库 "st ...
- JQuery滑动到指定位置
$('html, body').animate({ scrollTop: next_tip.offset().top + "px"},500);
- Docker安装RabbitMQ,RabbitMQ Management使用
原文:Docker安装RabbitMQ,RabbitMQ Management使用 版权声明:本文为博主原创文章,未经博主允许不得转载.需要转载请先评论或者邮箱联系我,谢谢! https://blog ...
- groupbox里面添加Form
/// <summary> /// 动态加载dll /// 反射 /// </summary> private void dynamicDll() { string dllNa ...
- Java基础学习总结(54)——JSON和Map转换的工具类
在pom.xml文件中引入如下jar <dependency> <groupId>commons-lang</groupId> <artifactId> ...
- Dynamics CRM2016 Web API之Expand related entities & $ref & $count
本篇介绍两个关于1:N关系中通过主实体取关联子实体的api,这两个api会常常被用到并且比原来的odata方式更加方便.之前假设我们要取主实体下全部的关联实体的记录都是通过Retrieve Multi ...