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 ...
随机推荐
- 源码分析-----ThreadPoolExecutor
创建一个线程池: import time from concurrent.futures import ProcessPoolExecutor, as_completed def get_html(n ...
- macrotask与microtask
在说明宏任务及微任务前总结一下事件循环机制(event loop): 首先判断JS是同步还是异步,同步就进入主线程,异步就进入event table 异步任务在event table中注册函数,当满足 ...
- Java线程池,isShutDown、isTerminated的作用与区别
isShutDown当调用shutdown()或shutdownNow()方法后返回为true. isTerminated当调用shutdown()方法后,并且所有提交的任务完成后返回为true;is ...
- Qt高仿Excel表格组件-支持冻结列、冻结行、内容自适应和合并单元格
目录 一.概述 二.效果展示 三.实现思路 1.冻结行.冻结列 2.行高自适应 3.蚂蚁线 四.测试代码 1.添加表格数据 2.设置冻结行.列 3.行高.列宽 4.单元格背景色 5.单元格文字 6.其 ...
- c语言-数组、指针面试题
转载 说明:所有题目均摘录于网络以及我所见过的面试题目,欢迎补充! 无特殊说明情况下,下面所有题s目都是linux下的32位C程序. 先来几个简单的热热身. 1.计算以下sizeof的值. char ...
- Golang循环中调用go func参数异常分析
项目中,需要循环调用API服务器列表,在循环中使用go func创建协程时遇到了参数失灵的现象. 具体代码如下所示: for _, apiServerAddr := range apiServerAd ...
- Yum项目上线实战 (网站运维)-Linux从入门到精通第十一天(非原创)
文章大纲 一.编译安装与卸载Nginx二.关于LAMP三.LAMP环境部署四.学习资料下载五.参考文章 一.编译安装与卸载Nginx Nginx:是一款比较流行的web服务器软件,类似于Apach ...
- nginx之旅(第一篇):nginx下载安装、nginx启动与关闭、nginx配置文件详解、nginx默认网站
一.nginx下载安装 版本nginx 1.15.5 系统环境centos7.5(本机ip192.168.199.228) 关闭selinux 和防火墙firewall 1.下载 wget http: ...
- qtcreator VLD内存检测
简介 Visual Leak Detector是一款用于Visual C++的免费的内存泄露检测工具.相比较其它的内存泄露检测工具,它在检测到内存泄漏的同时,还具有如下特点: 可以得到内存泄漏点的调用 ...
- httprunner学习25-文件上传multipart/form-data
前言 httprunner上传文件接口,其实跟requests上传文件的接口是一样的,之前在python接口系列里面有案例 python接口自动化16-multipart/form-data上传图片 ...