点击按钮播放背景音效

用插件之前我们是要引入插件库的本篇文章使用 howler.js 第三方库引入

废话不多说咱直接上代码

html 代码块

<!-- 我们就只用两个按钮来做本次demo演示 -->
<button class="play">播放</button>
<button class="stop">暂停</button><!-- 引入第三方库 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.1.1/howler.min.js"></script>

js 代码块

// 查看按钮音效
// 创建实例
var viewSound = new Howl({/* 音频路径 可用相对路径 */src: ['http://fjdx.sc.chinaz.net/Files/DownLoad/sound1/201702/8369.mp3'],/* 是否循环播放 默认为 false */autoplay: false,/* 是否循环播放 默认为 false */loop: false,/* 设置声音大小，从 0.0 到 1.0 */volume: 1,onend: function() {console.log('自动结束!')},onstop: function() {console.log('暂停!')},onplay: function() {console.log('播放!')}
})
var stop = document.getElementsByClassName('stop')[0]
var play = document.getElementsByClassName('play')[0]
stop.onclick = function() {/* 暂停音效 */viewSound.stop()
}
play.onclick = function() {/* 播放音效 */viewSound.play()
}

操作实例

播放
暂停

howler 音频插件使用相关推荐

JavaScript 音频插件和图表插件
howler音频插件配置项及事件 <!DOCTYPE html> <html lang="en"> <head><meta charse ...
au vst插件_失真效果音频插件
iZotope Trash 2 Mac版是一款可以在苹果电脑MAC OS平台上使用的具有64bit处理制造失真效果的音频插件.iZotope Trash 2 可以对任何音频文件进行失真效果的处理,现为 ...
Arturia Prophet Mac音频插件：将Prophet 5，Prophet VS，Prophet Hybrid三种不同音乐合成器于一体
Prophet 5和Prophet VS设定了标准并重新定义了现代合成器.我们为您带来了这些经典. Prophet 5是市场上第一款完全可编程的合成器.迄今为止,这种革命性合成器已成为所有其他合成器的 ...
flstudio插件找不到_【干货】音频插件完全指引手册
本文适合于音乐制作初学者.和有一定经验但仍希望查漏补缺的音乐人朋友们.希望通过本文,帮助大家全面.系统.通俗易懂地了解音频插件,并知道如何选择. 什么是音频插件随着时代进步,现代音乐制作已广泛采用P ...
Howler 音频资源跨域提示html5
Howler 音频资源跨域提示html5 使用howler 播放音频时,会遇到资源跨域报错,因为Howler默认使用Web Audio,但在IE上可以自动转为HTML 5 Audio,而web aud ...
United Plugins Total Bundle for Mac(联合音频插件合集包)
Plugins Total Bundle是一款由多个音频插件厂商或团队共同发布的联合音频插件合集包,这款插件包含有19种来自不同团队的音频效果器.这些效果器能够满足大家各类风格的音频效果处理. U ...
专业 DAW 音频插件：Voxengo Plug-ins Bundle for Mac(Voxengo系列音频插件合集)
Voxengo 为您提供高质量的专业 DAW 音频插件:VST 插件.AAX 插件和 AU 插件,以及采样率转换器.我们的目标是为音频和音乐制作(包括母带制作和环绕声)提供用户友好.强大且高效的解决方 ...
音频插件包：Unfiltered Audio Plugins Bundle for Mac
今天给大家带来的是一款超级强大的音频插件包,unfiltered audio plugins bundle mac破解版可以在Ableton Live,Logic Pro X,Pro Tools,RE ...
关于使用3D音频插件过程中失声问题
大家好,今天小白给大家简单分享下我在使用高通3D音频插件过程中遇到的更改音频设置就不会产生声音的问题及其解决方式,欢迎一起学习交流. 一.问题描述我使用的Unity版本是2018.3.1.9f1,由 ...
Unfiltered Audio Plugins Bundle for Mac(音频插件包)附破解教程 v2.0.0激活版
与大家分享一套Unfiltered Audio系列音频插件包 Unfiltered Audio Plugins Bundle for Mac 激活版.该插件包可以在Ableton Live,Logic ...

howler 音频插件使用

点击按钮播放背景音效

html 代码块

js 代码块

操作实例

howler 音频插件使用相关推荐

最新文章

热门文章