vue添加背景音乐
vue添加背景音乐需要用到HTML中的标签
参考手册:http://www.w3school.com.cn/tags/html_ref_audio_video_dom.asp
*在iOS端autoplay不会起作用,因为iOS系统屏蔽了页面加载自动播放之类,所以我们需要在页面加载的时候调用一次play方法,具体play方法放在哪里就随意了,因为我的页面有wx.ready方法所以我就放在那里了
<audio :src="mus" class="media-audio" loop autoplay ref="MusicPlay"></audio>
mus: require("../assets/mus.wav"), //使用的音频
/**
* 暂停音乐并停止旋转
*/
musicPause() {
this.$refs.MusicPlay.pause();
this.musicTF = true;
},
/**
* 播放音乐并开始旋转
*/
musicPlay() {
this.$refs.MusicPlay.play();
this.musicTF = false
},
因为开始按钮在别的地方控制,所以用ref指向auto
vue添加背景音乐的更多相关文章
- vue 页面 添加背景音乐
背景音乐 添加背景音乐 并有单击事件 循环播放 <template> <div id="page"> <div style="width ...
- h5页面添加背景音乐
[需求]h5页面添加背景音乐,支持微信.QQ.各种APP. [实现思路]1.通过audio标签,设置自动播放,是一种方法,但是此方法只适合微信.QQ,并不兼容我司的APP,需要主动触发下播放事件. 2 ...
- Java代码添加背景音乐
太心塞!弄了很久才终于把Java添加背景音乐实现了.不过还是很Happy! 这次介绍的办法,是只要一打开Java Application,便可直接听到背景音乐.代码保存,方便以后再次利用. packa ...
- QQ空间添加背景音乐
QQ空间背景音乐方式 1.QQ音乐添加背景音乐一种是开通绿砖[有矿的忽略此条]2.QQ空间添加网络音乐的方法步骤:1.首先,需要先下载好想要音乐作为QQ空间背景音乐的歌曲文件(建议为MP3格式)[我这 ...
- 005-unity3d 添加背景音乐、音效 以及 天空盒子
一.基础知识 1.项目中需要有AudioListener,播放器中播放的声音就是AudioListener组件坐在的位置听到的声音.默认AudioListener是放到Main Camera上.没有A ...
- vue添加页面键盘事件
我司开发项目,用的是vue+elementUI,做登陆页面的时候,点击enter键的时候要实现和点击登陆按钮一样的功能,所以就百度了一下,于是一通百度之后,就在点击按钮上面直接添加了@keyup.en ...
- Vue添加请求拦截器
一.现象 统一处理错误及配置请求信息 二.解决 1.安装 axios , 命令: npm install axios --save-dev 2.在根目录的config目录下新建文件 axios.js ...
- 百度地图API示例:使用vue添加删除覆盖物
1.index.html <script type="text/javascript" src="http://api.map.baidu.com/api?v=2. ...
- Unity 之 添加背景音乐 以及 Slider控制
游戏音频分为背景音乐与环境音乐两种.Audio Clip(音频剪辑)有四种音乐格式.MP3:适合较长音频,作为背景音乐.Ogg:适合较长音频,作为背景音乐.Wav:适合较短音频,作为环境音乐.Ai ...
随机推荐
- 想让自己的项目6666,可是 Chrome 不答应!
读万卷书,行万里路!有的技能可以从书里学会,有的技能却需要在实战中打怪升级慢慢掌握,今天就来和大家聊一个很多小伙伴经常遇到的问题. 缘起 有人向松哥反映,在搭建微服务分布式配置中心 Spring Cl ...
- Java学习:JDK8的新特性
Java学习:JDK8的新特性 一.十大特性 Lambda表达式 Stream函数式操作流元素集合 接口新增:默认方法与静态方法 方法引用,与Lambda表达式联合使用 引入重复注解 类型注解 最新的 ...
- Mysql系列(九)—— 性能分析explain执行计划
explain是mysql中sql优化的一个重要手段.顾名思义,explain就是解释sql,用于表示sql是怎样执行的信息,即sql执行计划! 语法 explain statement statem ...
- ActionMq + mqttws3.1 实现持久化订阅
activemq版本:5.15.3 Eclipse Paho MQTT JavaScript library mqttws3.1:在amq安装目录下webapp-demo目录下可以找到 实现步骤请阅读 ...
- pyhanlp的安装
github 的官方地址:https://github.com/hankcs/pyhanlp conda install -c conda-forge jpype1 pip install pyhan ...
- sslscan
msf > use auxiliary/pro/web_ssl_scan msf auxiliary(web_ssl_scan) > show options Module options ...
- elasticsearch安装中文分词器插件smartcn
原文:http://blog.java1234.com/blog/articles/373.html elasticsearch安装中文分词器插件smartcn elasticsearch默认分词器比 ...
- 并发编程 || Java线程详解
通用线程模型 在很多研发当中,实际应用是基于一个理论再进行优化的.所以,在了解JVM规范中的Java线程的生命周期之前,我们可以先了解通用的线程生命周期,这有助于我们后续对JVM线程生命周期的理解. ...
- 嵌入式linux开发uboot启动过程源码分析(一)
一.uboot启动流程简介 与大多数BootLoader一样,uboot的启动过程分为BL1和BL2两个阶段.BL1阶段通常是开发板的配置等设备初始化代码,需要依赖依赖于SoC体系结构,通常用汇编语言 ...
- 201671010450-姚玉婷-实验十四 团队项目评审&课程学习总结
项目 内容 所属科目 软件工程http://www.cnblogs.com/nwnu-daizh 作业要求 https://www.cnblogs.com/nwnu-daizh/p/11093584. ...