页面添加H5声音图标

界面悬浮在表面,更换播放器样式(后来根据需要没有设置悬浮)
界面告警每隔几秒报一次警,声音就响一次
同时要实现,如果不想报警/播放,实现关闭音乐效果

 <audio src="../../../voice/warn.wav" id="audio"></audio>
<img id='musicAudioPlayAndPause' onclick='playOrPaused(this);'src='../../../images/on.png' />

 var flagVoice = 1;//声音关闭状态为2,开启状态为1$.ajax({type: "POST",url: wsurl + "/Api/WorkFlow/AlarmHandle/Fault/Get.asmx/ByStatus",data: { DGId: DGId, token: token },dataType: "json",success: function (data) {if (!(["info"] in data)) {for (var i = 0; i < getJsonObjLength(data.Table) ; i++) {if (data.Table[i].HdStatus == 1) {...setTimeout("GetCount(1)", 5000);//判断预警>0,执行响起警报声音if (flagVoice == 1) {if ($("#spanHdAlarm").text() > 0) {// initAudio();audio.play();} else {// do nothing}}},error: function () {ShowMsg('系统错误，请联系管理员。', "false");}});}//暂停或播放 声音function playOrPaused(obj) {if (flagVoice == 2) {//audio.play();flagVoice = 1;document.getElementById("musicAudioPlayAndPause").setAttribute("src", "../../../images/on.png");return;} else if (flagVoice == 1) {flagVoice = 2;//audio.pause();document.getElementById("musicAudioPlayAndPause").setAttribute("src", "../../../images/off.png")}}

参考网上写的自定义播放器代码

<!DOCTYPE html>
<

页面添加H5声音图标相关推荐

在html页面添加了评论和回复的显示页面
在html页面添加了评论和回复的显示页面先来看看效果图,用了Layui的框架,图片查看用了layui的photos,这功能很赞. 源码如下: <!doctype html> <ht ...
计算机桌面上的声音图标没了怎么办,Win7电脑右下角声音图标不见了怎么办？...
最近有Win7用户反映,电脑右下角的声音图标总是莫名其妙的不见了,导致用户要调整音量的时候不知道从哪调整,这让用户非常烦恼.那么,Win7电脑右下角声音图标不见了怎么办呢?下面,我们就一起往下看看Wi ...
html title中加图标,科技常识：HTML中title前面小图标的实现_如何给网页标题添加icon小图标...
今天小编跟大家讲解下有关HTML中title前面小图标的实现_如何给网页标题添加icon小图标 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关HTML中title前面小图标的实现_如何给网 ...
支付宝小程序添加H5域名配置失败原因
支付宝小程序里打开H5页面在支付宝小程序里,不能外跳H5页面.针对小程序不能外跳 H5 页面,提供 web-view 页面承载组件将 H5 嵌套进小程序,实现在小程序内打开 H5 页面. 要想在小程 ...
电脑桌面两个计算机图标怎么删除,电脑声音图标怎么有两个,怎么除掉一个
公告: 为响应国家净网行动,部分内容已经删除,感谢读者理解. 话题:电脑声音图标怎么有两个,怎么除掉一个回答:p是1."声音和音频设备"还是2."Realtek高清晰音频 ...
app 中嵌入H5页面，H5跳转H5页面的跳转实现
app 中嵌入H5页面,H5跳转H5页面的跳转实现模拟创建a标签,并将href给到a标签点击实现: 模拟创建a标签,并将href给到a标签点击实现: var a = document.createE ...
iconfont怎么引入html,Web页面中引用iconfont图标
阿里妈妈出品的 iconfont 是一个矢量图标管理.交流平台,支持矢量图.位图等格式下载,并提供便捷的前端项目植入引用方法,是当前Web开发中主流的icon解决方案. 想要在前端页面中引入图标,一个 ...
php添加网站ico图标,phpcms在地址栏中显示网站图标的方法(增加网站ico图标)
本文关键详细介绍了phpcms在地址栏中显示信息网站图标的方式(提升网站ico图标),必须的盆友能够参照下 phpcms怎样在地址栏中显示信息网站的图标最先寻找网站的css文件,刚开始在里面改动. ...
服务器声卡图标显示x,电脑声音图标显示红叉【设置模式】
喜欢使用电脑的小伙伴们一般都会遇到win7系统电脑声音图标显示红叉的问题,突然遇到win7系统电脑声音图标显示红叉的问题就不知道该怎么办了,其实win7系统电脑声音图标显示红叉的解决方法非常简单,按照 ...

页面添加H5声音图标

页面添加H5声音图标相关推荐

最新文章

热门文章