h5音频播放,里面參数能够查看http://www.w3school.com.cn/html5/html_5_audio.asp
<audio controls="controls">
<source src="song.ogg" type="audio/ogg">
<source src="song.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>
html部分:
<div style="z-index: 999; width: 30px; height: 30px; position: absolute; top: 2%; left: 89%; cursor: pointer;" id="mplay"> 
   <audio autoplay="autoplay" loop="loop" id="audio" src="http://www.eyee.cn/Public/Uploads/images/2015/04/27/699/553df80928571.mp3"> 
<!--    <source src="song.mp3" type="audio/mpeg"></source> -->使用本地音乐
   </audio> 
</div> 
js效果:能够通过点击一张图片来控制音乐的播放和暂停
      var sj_music = true;
      var music = document.getElementById("audio");
      $("#mplay").click(function(){
          if(sj_music){
            $(this).css("background-image","url(images/musicoff.png)");
            music.pause();
            sj_music = false;
          }else{
            $(this).css("background","url(images/musicon.png)");
            music.play();
            sj_music = true;
          }          
      });
效果例如以下:
播放时效果
暂停时效果

h5播放音乐的更多相关文章

  1. iphone微信 h5页音乐自动播放

    iphone微信 h5页音乐自动播放: // iphone自动播放 document.addEventListener("WeixinJSBridgeReady", functio ...

  2. 【极品代码】一般人我不告诉他,手机端h5播放时不自动全屏代码

    已测适用于ios,某些安卓手机微信下播放视频会出现播放器控件(这个实在是无力吐槽噢,因为之前还遇到过微信播放完视频后竟然无法退出全屏出现广告的情况,只有播放完后刷新页面并且要放到框架页里才能屏蔽微信视 ...

  3. pcDuino-V2利用madplay播放音乐

    在pcDuino的UBUNTU系统下,打开控制台,利用apt-get来下载madplay软件. sudo apt-get install madplay 播放音乐: madplay xxx.mp3 x ...

  4. matlab播放音乐

    最近在做计算,写了一些matlab代码,脑壳还疼,所以决定发挥一下逗B精神,写一个程序玩一下. 想了想,既然写代码的时候喜欢听歌,而且我的电脑打开网易音乐的速度巨慢(不知道为什么..),那些一个程序直 ...

  5. go语言让windows发出声音,或者播放音乐

    go语言让windows发出声音,或者播放音乐的例子:会发出alert警告的声音 ( 这是我应群员的求助写的, 如果你需要了解其中的调用原理或过程 或更多go语言调用win32api的资料,加群: 2 ...

  6. Inno调用dll --- 实现背景播放音乐

    Inno 播放音乐可以调用系统api函数mciSendString来实现,而mciSendString函数存在C:\Windows\System32\winmm.dll中,因此最终只要成功从该dll文 ...

  7. 【分享】4412开发板ubuntu 12.0.4播放音乐没有声音解决方法

    转自迅为论坛:http://bbs.topeetboard.com 准备工作 1.下载 vim 在命令行上输入 apt-get install vim 下载 vim 2.输入 vim /etc/hos ...

  8. 在Linux终端命令行下播放音乐的命令(Ubuntu)

    现在的 Linux 桌面已经发展的很好了,在桌面下播放音乐操作起来也很简单.那么我们还记得在桌面不是那么好的时候我们是怎么播放音乐的么?哎,我是想不起来了,实在是太难了. 不过现在我们可以先安装一个小 ...

  9. C# 调用系统winmm.dll 播放音乐wav mp3

    using System.Runtime.InteropServices;//放wav public partial class frmMain : Form { 系统放 播放音乐 wav mp3 [ ...

随机推荐

  1. thinkphp5项目--个人博客(六)

    thinkphp5项目--个人博客(六) 项目地址 fry404006308/personalBlog: personalBloghttps://github.com/fry404006308/per ...

  2. 基于深度学习的病毒检测技术无需沙箱环境,直接将样本文件转换为二维图片,进而应用改造后的卷积神经网络 Inception V4 进行训练和检测

    话题 3: 基于深度学习的二进制恶意样本检测 分享主题:全球正在经历一场由科技驱动的数字化转型,传统技术已经不能适应病毒数量飞速增长的发展态势.而基于沙箱的检测方案无法满足 APT 攻击的检测需求,也 ...

  3. rest_framework-权限-总结完结篇

    #权限#创建一个权限类 在view添加列表 class MyPermission(object): #message 表示权限决绝时返回的数据 message = "必须是SVIP" ...

  4. django uWSGI nginx搭建一个web服务器 确定可用

    网上的找了很多篇 不知道为什么不行,于是自己搭建了一个可用的Web 大家可按步骤尝试 总结下基于uwsgi+Nginx下django项目生产环境的部署 准备条件: .确保有一个能够用runserver ...

  5. CSS中关于vertical-align垂直对齐

    一向以来,我对vertical-align的属性都搞的不是太清楚,今天刚好碰到有朋友问我相关的问题,于是自己潜心研究了一番,发现这玩意还真不是个简单的东西,在此我分享的东西都是抛弃脑残的IE的,如果你 ...

  6. iOS中关于字符 “&”的作用?

    如NSFileManager中关于判断是否目录的 iOS中关于字符 "&"的作用? >> ios这个答案描述的挺清楚的:http://www.goodpm.ne ...

  7. vue 中使用querySelect 封装的万能选择器

    function query (el) { if (typeof el === 'string') { var selector = el; el = document.querySelector(e ...

  8. Linux LVM在线扩容

    环境: 虚拟化环境,SUSE Linux Enterprise Server 11sp3,直接把虚拟磁盘从100G改成150G. 现有的LVM是100G,/home 的LV需要再加50G. 步骤: f ...

  9. 对比学习sass和stylus的常用功能

    在众多的css预处理器语言中,sass和stylus算是十分优秀的两个.本文主要针对两者的常用功能做个简单的对比分析.在对比中了解二者的差异,同时帮助大家更好的掌握这两种预处理语言.本文涉及到的sas ...

  10. 紫书 习题 10-12 UVa 557(概率计算)

    开始的时候我没有考虑1/2的概率,直接一波组合数,然后WA 后来去看题解发现我们可以反过来想,求最后两个人不一样的情况 这个时候肯定会抛到最后的 所以每一种可能就是(0.5)^(n - 2),然后一共 ...