个人工作笔记

1.创建Audio元素的方法:

(1)document.createElement() 方法

(2)new Audio()

2.音乐播放

相关资料:

https://developer.mozilla.org/en-US/docs/Web/API/HTMLAudioElement

// 使用js生成Audio元素的方法

var audio = document.createElement('audio');//生成一个audio元素

audio.controls = true;//这样控件才能显示出来

audio.src = 'dar.mp3';//音乐路径

document.body.appendChild(audio);//把它添加到页面中

var maudio = new Audio();

maudio.controls = true;//这样控件才能显示出来

maudio.src = 'dar.mp3';//音乐路径

document.body.appendChild(maudio);//把它添加到页面中

// 背景音乐

var bgAudio = new Audio();

bgAudio.setAttribute("src","dar.mp3");

bgAudio.loop = false;

// 音乐开始播放

bgAudio.play()

$(".btn").on("click",function(){

// 音乐停止播放

bgAudio.pause();

// 音乐从头开始播放

bgAudio.currentTime = 0;

})

//判断音乐播放结束

audio.addEventListener('ended',function(){

console.log("33");

},false);

css文件插入背景音乐,h5页面添加背景音乐相关推荐

  1. js给html设置背景音乐,最简单最快的方法给H5页面添加背景音乐播放(css样式美化)...

    看了很多场景应用,右上角总是会有一个音频按钮,会播放音乐,现在通过简单几步就可以实现这个功能. 1.先上基础的html,定位用了fixed(source 标签里面对应的音频链接换为自己的音频连接) 2 ...

  2. HTML页面添加背景音乐

    HTML页面添加背景音乐 方法 1.js中添加即可(亲测好用) // 背景音乐var bgAudio = new Audio();bgAudio.setAttribute("src" ...

  3. css文件插入背景音乐,在HTML中添加背景音乐

    方法一: 在源代码中编写以下几句代码将能实现在HTML网页内添加背景音乐: src="http://demo.mimvp.com/html5/take_you_fly.mp3"&g ...

  4. css文件插入背景音乐,博客园添加背景音乐,背景效果!

    博客园添加背景音乐,背景效果 申请博客园js权限 申请话术 实例 尊敬的博客园管理员: 请求申请开通js权限,希望能够把自己的博客修饰的漂亮点,点缀自定义js插件效果,希望管理员可以批准,谢谢! 开通 ...

  5. css文件插入背景音乐,关注css背景音乐代码

    1.如何隐藏播放器而不影响音乐播放 在css 文件的空白处添加以下代码: #mod_bgmusic{display:none} 不显示播放器,但不影响音乐的播放. 2.让baidu空间背景音乐支持多首 ...

  6. 网页自动切换html css js,HTML页面自动清理js、css文件的缓存(自动添加版本号)_HTML/Xhtml_网页制作...

    这篇文章主要介绍了HTML页面自动清理js.css文件的缓存(自动添加版本号),小编觉得挺不错的,现在分享给大家HTML源码,也给大家做个参考.对HTML感兴趣的小伙伴们一起跟随小编过来看看吧 在we ...

  7. html中添加背景音乐的标签,添加背景音乐的html标签是什么

    添加背景音乐的html标签是,bgsound是用以插入背景音乐,但只适用于IE,在netscape和firefox中并不适用,其参数设定很少,语法如"". 添加背景音乐的html标 ...

  8. html5多首背景音乐,给视频添加背景音乐|多个视频按顺序合并,添加背景音乐,或者更换背景音乐...

    如可给视频添加背景音乐,多个视频按顺序合并,添加背景音乐,源视频有声音了,如何去掉添视频声音,添加新的背景音乐? 第二步:运行 office powerpoint软件,添加刚合并好的视频,制作成ppt ...

  9. php视频设置背景音乐,给视频添加背景音乐-视频配乐详细步骤

    在我们平时生活中,为了记录一些美好的事物,或者为了记录我们逗逼的日常,总会拍摄一些小视频.小编昨天拍了一朋友左手拿着衣服搭在肩上.还戴着副墨镜大摇大摆走进房间的视频,此时真想给他的出场配一段音乐,把他 ...

最新文章

  1. Eclipse中阿里JAVA代码规范插件(P3C)的安装及使用
  2. MariaDB Galera Cluster环境搭建及高可用测试
  3. Node.js 初识 fs 模块
  4. 使用 ebpf 深入分析容器网络 dup 包问题
  5. django防止csrf跨域伪造攻击
  6. 《3》CentOS7.0+OpenStack+kvm云平台部署—配置Glance
  7. mongodb查询文件服务器的数据,服务器端知识库mongodb基础篇
  8. MySql中的变量定义
  9. 从Google搜索联想到了jQuery
  10. 官网opencv练习题 最简单的多物体分离技术
  11. FFmpeg学习(11)——视频转码之-crf参数详解
  12. GPUImage源码解读之GPUImageFramebufferCache
  13. 泰勒公式和海森矩阵(Hessian-matrix)
  14. 常见操作系统体系结构
  15. 一篇博客带你入门shiro
  16. Bert系列:论文阅读Learning-to-rank with bert in tf-ranking
  17. 墨者 SQL手工注入漏洞测试(MySQL数据库)
  18. Espresso Idling Resource 使用
  19. 【Python爬虫_1】爬取巴比特社区前5页列表和内容;
  20. CSDN文章摘要自定义修改

热门文章

  1. 云计算平台2017年盘点——真正成为新技术新应用的基础架构
  2. redhat 6.5怎么安装mysql5.6_centos 6.5安装mysql5.6
  3. python识别手写文字_如何快速使用Python神经网络识别手写字符?(文末福利)
  4. python如何提高程序可读性_提高Python的可读性?
  5. SpringBoot 整合 knife4j
  6. 关于java的取整/和取余%
  7. linux CentOS7最小化安装环境静默安装Oracle11GR2数据库(修改配置文件_06)
  8. Springboot部署到Tomcat,可以不带项目名进行访问
  9. Easyexcel异常处理:getOutputStream() has already been called for this response
  10. python 两个数据框合并计算_一文掌握Excel、SQL、Python【数据合并】大法!