<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <script src="js/jquery-1.10.1.min.js" type="text/javascript"></script>

</head>

<body>

<a class="mscBtn" id="audioBtn" style="cursor:pointer;"></a>

<audio id="bgMusic" src="http://tenc.rabbitpre.com/mp3/c5de3e51-7096-4ae5-9af1-50f3eca80f1d" autoplay="autoplay" loop="loop"></audio>

<script>

    var music = document.getElementById("bgMusic");

    $("#audioBtn").click(function(){

        if(music.paused){//检查视频是否已暂停 true 指示音频/视频已暂停。否则为 false。

            music.play();//开始播放

            $("#audioBtn").removeClass("pause").addClass("play");

        }else{

            music.pause();//暂停播放

            $("#audioBtn").removeClass("play").addClass("pause");

        }

    });

</script>

<style>

    .pause {background-position: 0 bottom;}

    .mscBtn {height: 50px;

        background: #fff url(images/musicBtn.gif) no-repeat;

        display: block;

    }

</style>

</body>

</html>

jquery 如何控制音乐打开和关闭的更多相关文章

  1. jQuery、layer实现弹出层的打开、关闭功能实例详解

    本文主要介绍了jQuery.layer实现弹出层的打开.关闭功能,需要的朋友可以参考下,希望能帮助到大家. 打开弹出层: 在list页面带入layer.js 在list页面点击时,弹出form弹出层, ...

  2. Bootstrap 基于Bootstrap和JQuery实现动态打开和关闭tab页

    基于Bootstrap和JQuery实现动态打开和关闭tab页   by:授客 QQ:1033553122 1.   测试环境 JQuery-3.2.1.min.j Bootstrap-3.3.7-d ...

  3. 深入学习jQuery动画控制

    × 目录 [1]动画状态 [2]停止动画 [3]动画延迟[4]全局控制 前面的话 jQuery动画可以使用fade.hide.slide等方法实现基本动画效果,可以使用animate实现自定义动画,甚 ...

  4. Linux C 文件与目录2 文件的打开与关闭

    文件的打开与关闭 open和close 文件的打开指的是从磁盘中找到一个文件,返回一个整形的打开文件顺序的编号.打开的文件处于可读.可写状态.文件的关闭指的是释放打开的文件,是文件处于不可读写的状态. ...

  5. Linux C编程--打开和关闭流

    以下函数用于打开和关闭一个流.#include <stdio.h>FILE * fopen (const char *pathname, const char *opentype);int ...

  6. 【转】Android：Bluetooth 的打开和关闭--不错

    原文网址:http://www.ifeegoo.com/android-turn-on-and-turn-off-bluetooth.html 摘要:Android 中打开和关闭 Bluetooth ...

  7. 不使用JavaScript实现菜单的打开和关闭

    我在写有菜单栏的网页时,基本都会用响应式设计来适配移动端,例如把不重要的菜单选项隐藏,或者创建一个菜单按钮来控制的菜单的打开和关闭之类的.而我之前一直是使用JavaScript来实现菜单的打开和关闭的 ...

  8. Layer组件多个iframe弹出层打开与关闭及参数传递

    一.Layer简介 Layer是一款近年来备受青睐的web弹层组件,基于jquery,易用.实用,兼容包括IE6在内的所有主流浏览器,拥有丰富强大的可自定义的功能. Layer官网地址:http:// ...

  9. sql server 关于表中只增标识问题 C# 实现自动化打开和关闭可执行文件（或 关闭停止与系统交互的可执行文件） ajaxfileupload插件上传图片功能，用MVC和aspx做后台各写了一个案例 将小写阿拉伯数字转换成大写的汉字， C# WinForm 中英文实现， 国际化实现的简单方法 ASP.NET Core 2 学习笔记（六）ASP.NET Core 2 学习笔记（三）

    sql server 关于表中只增标识问题   由于我们系统时间用的过长,数据量大,设计是采用自增ID 我们插入数据的时候把ID也写进去,我们可以采用 关闭和开启自增标识 没有关闭的时候 ,提示一下错 ...

随机推荐

  1. tetetet

    http://www.wuwenhui.cn/2623.html http://www.360doc.com/content/16/1104/09/36005694_603810507.shtml

  2. #安装memcache

    安装memcache sudo apt-get install memcached sudo apt search php-memcache sudo apt-get install php-memc ...

  3. String和Irreducible Polynomial（2019牛客暑期多校训练营（第七场））

    示例: 输入: 4000010010111011110 输出: 00001001 0111 01111 0 题意:给出一个只含有0和1的字符串,找出一种分割方法,使得每个分割出的字符串都是在该字符串自 ...

  4. R学习笔记1 介绍R的使用

    R脚本的一次执行叫做一个会话(Session),可以通过函数quit()退出当前的会话 quit(save = "default", status = 0, runLast = T ...

  5. Java泛型 - 返回父类的子类

    一.栗子 public class GenericityInher { //error: Type mismatch: cannot convert from ArrayList<Child&g ...

  6. 传统IDC 部署网站

    选择IDC机房 1.选择云主机. 2.传统IDC a购买服务器 b服务器托管 c装系统 装系统 虚拟机软件 vmware workstation virtualbox hyper-v 下载:r.ami ...

  7. idea 自动生产 api文档

    第一: 打开idea,选择项目.点击工具栏 Tools->Generate JavaDOC 第二: 主要分为三部分内容. 1,Generate JavaDoc scope 要扫描生成api的范围 ...

  8. dubbo源码阅读之服务引入

    服务引入 服务引入使用reference标签来对要引入的服务进行配置,包括服务的接口 ,名称,init,check等等配置属性. 在DubboNamespaceHandler中,我们可以看到refer ...

  9. Vue项目中遇到的问题汇总

    一.打包后的打开index.html页面空白的几种情况: 引入的css.js路径报错,此时解决方法:把vue.config.js中的增加publicPath: ‘./’ 或者把原来的baseUrl改为 ...

  10. C++线程同步与互斥之互斥体

    抢红包练习 第一步:在第一个文本框中输入一个值,比如1000: 第二步:点击抢红包,同时创建3个线程,每个线程循环进行抢红包的操作,每次抢50; 第三步:使用Mutex进行线程控制,当第一个文本框中的 ...