$(".gameSound").bind("click",function() {
            var audio = document.getElementById('music1');
           
            if(audio.paused){
                $(".gameSound").css({ //切换到播放的背景图片
                    "background": "url(../../../img/game/Sound.png) center no-repeat",
              "background-size": "cover"
                })
                audio.play();//audio.play();//播放
            }else{
                $(".gameSound").css({ //切换到暂停的背景图片
                    "background": "url(../../../img/game/SoundClose.png) center no-repeat",
              "background-size": "cover"
                })
                audio.pause();// 暂停
            }
         })

JS - 音频的播放和暂停的更多相关文章

  1. iOS 9音频应用播放音频之播放控制暂停停止前进后退的设置

    iOS 9音频应用播放音频之播放控制暂停停止前进后退的设置 ios9音频应用播放控制 在“iOS 9音频应用播放音频之ios9音频基本功能”一文可以看到AVAudioPlayer类有很多的属性以及方法 ...

  2. iOS 9音频应用播放音频之ios9音频基本功能

    iOS 9音频应用播放音频之ios9音频基本功能 在iOS 9音频应用开发中最为简单和常用的就是AVFoundation框架中的AVAudioPlayer类.虽然AVAudioPlayer类不能播放网 ...

  3. H5多媒体(用面向对象的方法控制视频、音频播放、暂停、延时暂停)

    视频,音频播放器会是我们在工作中用到的一些h5新标签,它自带一些属性,比如暂停播放,快进快退,但是,我们经常不用原生的样式或者方法,我们需要自定义这些按钮来达到我们需要的样式,也需要我们自定义来实现一 ...

  4. [js常用]连续播放音频

    许多音频连续播放.有的时候音频过大会分成多个音频.播放的时候需要连续播放 <!DOCTYPE HTML> <html> <head> <meta charse ...

  5. Wavesurfer.js音频播放器插件的使用教程

    Wavesurfer.js是一款基于HTML5 canvas和Web Audio的音频播放器插件,本文主要记录它及其视觉效果插件Regions插件的使用方法. 1.创建实例 引入插件 import W ...

  6. vue解决音频可视化播放,使用wavesurfer.js

    vue解决音频可视化播放,使用wavesurfer.js 上效果:   1.安装wavesurfer  npm install wavesurfer.js 2.在页面导入 import WaveSur ...

  7. HTML5-video标签-实现点击预览图播放或暂停视频

    HTML5-video标签-实现点击预览图播放或暂停视频 刚刚参加工作,开始更多的接触到一些新的知识,促使我开始了解html5和css3的新特性.这时我才真的发现到html5和css3的强大. 之前关 ...

  8. HTML5 - 使用JavaScript控制<audio>音频的播放

    有时我们需要使用js来控制播放器实现音乐的播放,暂停.或者使用js播放一些音效.   1,通过JavaScript控制页面上的播放器 比如把页面上添加一个<audio>用来播放背景音乐(由 ...

  9. HTML+纯JS制作音乐播放器

    该篇文章会教你通过JavaScript制作一个简单的音乐播放器.包括播放.暂停.上一曲和下一曲. 阅读本文章你需要对HTML.CSS和Javascript有基本的了解. 话不多说,先上图. emmm. ...

随机推荐

  1. 「SPOJ1487」Query on a tree III

    「SPOJ1487」Query on a tree III 传送门 把树的 \(\text{dfs}\) 序抠出来,子树的节点的编号位于一段连续区间,然后直接上建主席树区间第 \(k\) 大即可. 参 ...

  2. Py西游攻关之基础数据类型(四)-字典

    Py西游攻关之基础数据类型 - Yuan先生 https://www.cnblogs.com/yuanchenqi/articles/5782764.html 七 Dictionary(字典) 字典是 ...

  3. Python - metaclass元类

    参考 https://www.liaoxuefeng.com/wiki/0014316089557264a6b348958f449949df42a6d3a2e542c000/0014319106919 ...

  4. Python 操作rabbitmq中的confirm模式的错误

    今天使用rabbitmq的confirm模式,书上介绍的是pika版本是0.9.6,但是我用的是别的版本,发现这样的错误 Traceback (most recent call last):  Fil ...

  5. 8年经验面试官详解 Java 面试秘诀

      作者 | 胡书敏 责编 | 刘静 出品 | CSDN(ID:CSDNnews) 本人目前在一家知名外企担任架构师,而且最近八年来,在多家外企和互联网公司担任Java技术面试官,前后累计面试了有两三 ...

  6. 一文解读XaaS (转)

    艾克赛斯???别慌,读完你就知道啦~ 服务和云服务 了解Xaas云服务,不妨从了解服务开始. “服务”在本质上是一种租赁,它对资源的占用方式是“为我所用”而非“为我所有”,对资源的消费模式是按需付费而 ...

  7. NSIndexPath等结构体的比较

    1.NSIndexPath的比较方式,需要将结构体内部的属性一一对比.比如, if ((indexPath.section == self.selectIndexPath.section) & ...

  8. zabbix通过ipmi传感器监控浪潮服务器的硬件信息

    一:实验对象 操作系统版本:centos7.6 监控对象:通过服务器传感器获取到的所有在使用的硬件信息 zabbix版本: 4.0.14二:zabbix介绍 zabbix适合中小型企业.大型企业的用户 ...

  9. VMware安装CentOS操作系统详细步骤

    目录 创建虚拟机(买电脑) 1. 创建新虚拟机 2. 自定义配置虚拟机 3. 选择虚拟机硬件兼容性 4. 安装虚拟机创建系统 5. 选择虚拟机操作系统 6. 设置虚拟机名字和存放位置 7. 设置虚拟机 ...

  10. 六、java基础-单例模式_继承_覆盖_多态

    1.单例模式: 1)提出原因 是由gof 也就是四人组提出来的.为了保证jvm中某一类型的java对象永远只有一个,同时也是为了节省内存的开销.因为外面程序可以通过new的方法直接调用类里面的构造方法 ...