美文网首页
移动端项目连续点击播放音效叠加

移动端项目连续点击播放音效叠加

作者: 懿小诺 | 来源:发表于2020-06-22 09:51 被阅读0次

在vue中使用.play()方法实现点击播放音效,但是遇到音效时长大于两次点击时间间隔时,音效会在第一次点击开始播放,音效时间全部播放结束后,才能继续播放下一次点击的音效
若想要不管音效时长,点击就触发播放,实现音效叠加,这里使用.cloneNode().play();方法
但是此方法用在ios上,会一直复制audio标签导致加载资源次数较多,页面卡顿问题,android则不会,可能跟操作系统的处理机制有关,目前只能解决安卓端,ios不能实现

有解决方法的朋友可以留言,一起分享学习。

相关文章

  • 移动端项目连续点击播放音效叠加

    在vue中使用.play()方法实现点击播放音效,但是遇到音效时长大于两次点击时间间隔时,音效会在第一次点击开始播...

  • Android 音效 & SoundPool 封装类 & 停止音

    项目中,需要添加点击或者状态回调的音效。Android 有专门用于实现音效播放的类,就是 SoundPool 。 ...

  • Vue.js全家桶仿哔哩哔哩动画 (移动端APP)

    项目地址 · 由于项目是移动端,电脑访问时可以切换成手机端 · 播放页面其实没有根据B站移动端来, 比较粗糙? ·...

  • soundmanager2作为库引入ts项目

    简介 soundmanager2.js是一个非常优秀的web端音效播放库 以白鹭项目为例,其他ts项目类似。 js...

  • 移动端事件

    为什么移动端不用click移动端的click有300ms延迟的问题,在移动端浏览器中,连续两次点击是缩放操作,所以...

  • 视频播放--全屏处理

    在移动端浏览器, video 在用户点击播放或者通过API video.play() 触发播放时,会强制以全屏置顶...

  • 加载本地沙盒音效

    点击按钮会有音效、进入某个vc会播放背景音乐等,都是加载本地沙盒的音效 0.本地沙盒中添加音效: 1.加载音效的方...

  • 移动端video不全屏播放

    移动端开发过程中,有的时候会遇到video播放(不让全屏播放),但是浏览器默认都是点击自动全屏去播放。下面看解决方...

  • H5页面原生video标签移动端禁止全屏播放

    制作移动端H5,需要添加视频,点击播放的时候会自动全屏播放,记录一下处理局部播放的问题。标签写法: 解决播放前视频...

  • iOS开始之制作音乐播放器

    一、音频播放与音效播放的基础知识 音效播放 1、音效播放《1》功能介绍用于播放比较短小的音效 常用作系统的提示音...

网友评论

      本文标题:移动端项目连续点击播放音效叠加

      本文链接:https://www.haomeiwen.com/subject/tvztfktx.html