html5 audio 给博客 网页加背景音乐 可以加上个按钮或者链接 让其可停止或暂停

下面代码只是暂停 可以弄成暂停 播放两种状态切换。。

可以考虑换成a标签

  1. <a href="#" onClick="musicPaused()">停止</a>
  1. <script type="text/javascript">
  2. function musicPaused() {
  3. var music = document.getElementById("clickSound");
  4. music.pause();
  5. }
  6. </script>
  7. <audio id="clickSound" autoplay="autoplay">
  8. <source src="http://girls.iganlei.cn/baidupan/1125435669/4178294675.mp3">
  9. </audio>
  10. <input id="btn" type="button" onclick="musicPaused()" value="停止" />

HTML5添加背景音乐的更多相关文章

  1. h5页面添加背景音乐

    [需求]h5页面添加背景音乐,支持微信.QQ.各种APP. [实现思路]1.通过audio标签,设置自动播放,是一种方法,但是此方法只适合微信.QQ,并不兼容我司的APP,需要主动触发下播放事件. 2 ...

  2. Java代码添加背景音乐

    太心塞!弄了很久才终于把Java添加背景音乐实现了.不过还是很Happy! 这次介绍的办法,是只要一打开Java Application,便可直接听到背景音乐.代码保存,方便以后再次利用. packa ...

  3. vue添加背景音乐

    vue添加背景音乐需要用到HTML中的标签 参考手册:http://www.w3school.com.cn/tags/html_ref_audio_video_dom.asp *在iOS端autopl ...

  4. vue 页面 添加背景音乐

    背景音乐 添加背景音乐 并有单击事件   循环播放 <template> <div id="page"> <div style="width ...

  5. QQ空间添加背景音乐

    QQ空间背景音乐方式 1.QQ音乐添加背景音乐一种是开通绿砖[有矿的忽略此条]2.QQ空间添加网络音乐的方法步骤:1.首先,需要先下载好想要音乐作为QQ空间背景音乐的歌曲文件(建议为MP3格式)[我这 ...

  6. 005-unity3d 添加背景音乐、音效 以及 天空盒子

    一.基础知识 1.项目中需要有AudioListener,播放器中播放的声音就是AudioListener组件坐在的位置听到的声音.默认AudioListener是放到Main Camera上.没有A ...

  7. HTML中添加背景音乐

    <audio controls="controls" height="100" width="100"> <source ...

  8. Unity 之 添加背景音乐 以及 Slider控制

    游戏音频分为背景音乐与环境音乐两种.Audio   Clip(音频剪辑)有四种音乐格式.MP3:适合较长音频,作为背景音乐.Ogg:适合较长音频,作为背景音乐.Wav:适合较短音频,作为环境音乐.Ai ...

  9. xcode添加背景音乐/音效

    xcode添加音效:http://www.cnblogs.com/jiayongqiang/p/5625886.html 背景音乐: ios播放音乐时会用到一个叫做AVAudioPlayer的类,这个 ...

随机推荐

  1. ff与ie 的关于js兼容性

    FF的FIREBUG,不仅能测试JS还能检查CSS错误,是一般常用的.但它主要检查FF方面的错误,对IE就无能为力了.要测试IE,就用ieTester,它可以测试IE几乎所有版本(1.0恐怕也用不到测 ...

  2. .NET Web开发之.NET MVC框架

    摘要:MVC是一种架构设计模式,该模式主要应用于图形化用户界面(GUI)应用程序.那么什么是MVC?MVC由三部分组成:Model(模型).View(视图)及Controller(控制器). MVC概 ...

  3. 系统开发中按下Enter键登录系统

    转载来自:http://www.jb51.net/article/54308.htm 系统开发中按下Enter键登录系统,即就是监听键盘,当按下Enter键后调用登录按钮的click()事件. JS方 ...

  4. Jq自定义动画

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. mapkit定位以及俯视视图

    1.导入框架MapKit.framework,CoreGraphics.framework

  6. 【JSONKit】序列化Dictionary崩溃

    jsonkit通过Dictionary转换成JSON字符串时总是崩溃. 解析代码: 崩溃地点 分析是因为我的参数中全是数字   找了一下原因,不知道知道怎么设置,(求大神指点) 这里有一个折中办法使用 ...

  7. (原)java中opencv的width的问题

    调试程序,我这边负责在JNI中将缓冲区中的数据转换成bitmp.测试时用320*240的图像测试正常,但是别人使用的图像宽度为270时,图像出现了错位(没截图,不好理解). 首先想到的是opencv的 ...

  8. angularjs factory,service,provider 自定义服务的不同

    angularjs框架学了有一段时间了,感觉很好用.可以把angularjs的app理解成php的class,controller是控制器,而内置服务和自定义服务就可以理解成models了.angul ...

  9. 容联手机接口封装到ThinkPHP3.2.菜鸟图文教学

    今天来说下短信发送技术. 使用的是 容联http://www.yuntongxun.com/ 用法很简单, 具体要知道的参数有 ACCOUNT SID   应用ID AUTH TOKEN 应用toke ...

  10. Linux内核目录解析~

    以前进过一些公司看到一些服务器,把环境搭建都搭建在etc里面,而且都乱套了.在找PHP配置文件和apache的conf文件都难找到, 我们应该大致的了解下linux的文件分布 /etc : 放置系统重 ...