<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. web应用中实现同一个账号，后面登录的会把前面登录的挤下线

    在web应用中假如没有做会话控制,会出现这样的情况,A登录了账号,B也登录了账号,都是同样的账号,A修改了信息,B会看到修改的信息,这样的用户体验不好,B会觉得我没有修改啊,为什么信息会改变.而做会话 ...

  2. [转帖]FastDFS图片服务器单机安装步骤

    FastDFS图片服务器单机安装步骤 https://www.cnblogs.com/yuesf/p/11847103.html 前面已经讲 一张图秒懂微服务的网络架构,通过此文章可以了解FastDF ...

  3. VS2015如何在同一个解决方案下建立多个项目

    1.先按照常规的方法建一个项目: 2.点击解决方案:右键=>添加=>新建项目 注:本文链接:https://blog.csdn.net/weixin_43081805/article/de ...

  4. Socket简单Demo

    Socket协议网上介绍的有很多了,就不在画蛇添足了,本文主要编写一个小Demo,介绍下它具体实现 一:Socket服务器端 package com.founderit; import java.io ...

  5. ax 2012批处理不运行问题

    最近在开发12的批处理,但是很奇怪所有的都配置好了就是不跑批处理,假如你也出现了那用下面的方法试试: 12的批处理和09不一样,不是运行x++代码,而且运行你CIL生成的DLL文件, 1.你必须让你的 ...

  6. [CF868E]Policeman and a Tree

    题目大意:有一棵$n$个点的带边权的树,上面有$m$个罪犯,速度为任意大,有一个警察在点$S$,速度为$1$.若警察和罪犯在同一个地方,罪犯就被干掉了,警察希望干掉所有罪犯时间最短,而罪犯希望最大化这 ...

  7. go liteIDE 快捷键

    Goland常用快捷键文件相关快捷键: CTRL+E,打开最近浏览过的文件.CTRL+SHIFT+E,打开最近更改的文件.CTRL+N,可以快速打开struct结构体.CTRL+SHIFT+N,可以快 ...

  8. 5_PHP数组_3_数组处理函数及其应用_7_数组排列函数

    以下为学习孔祥盛主编的<PHP编程基础与实例教程>(第二版)所做的笔记. 数组排列函数 1. sort() 函数 程序: <?php $array = array("img ...

  9. 定时任务 Quarzt

    Quartz.Net是一个从java版的Quartz移植过来的定时任务框架,可以实现异常灵活的定时任务. Quartz 有三个概念分别是 计划者(ISchedeler).工作(IJob).触发器(Tr ...

  10. 阿里云OSS上传文件本地调试跨域问题解决

    问题描述: 最近后台说为了提高上传效率,要前端直接上传文件到阿里云,而不经过后台.因为在阿里云服务器设置的允许源(region)为某个固定的域名下的源(例如*.cheche.com),直接在本地访问会 ...