之前做的系统，在firefox浏览器下有更好的使用体验。因此要求客户统一使用firefox浏览器，前段时间客户要求在系统中加入音频效果。

　　在网上查了下，主要用到的标签有<bgsound>, <embd>, <audio>等等。其中<audio>标签是html5中新加入的对声音定义的标签。<bgsound>是IE的专用标签，只适用于IE浏览器。<embd>标签在firefox下，会要求你安装相关的插件。还好目前的新版本firefox浏览器都支持html5的规则，所以<audio>标签是首选了。但是对于音频格式，firefox有一定限制，wav格式音频无法正常播放，还是要装相关播放插件。对于MP3和OGG格式音频还是能正常支持。

　　所以，用html5的<audio>标签，嵌入MP3或OGG格式音频。

<!doctype html>

<html lang="en">

<head>

    <meta charset="utf-8">

    <title>web-sound test</title>

</head>

<body>

    <audio id="web-sound" controls="controls" autoplay="autoplay" loop="loop" src="Almost Lover.mp3">NO<audio>

</body>

</html>

　　写了个demo，歌挺好听 ：-）。以上。

firefox浏览器播放音频的更多相关文章

  1. 微信浏览器播放音频的问题：preload属性

    测试工具:ios微信. h5的Audio对象有个很重要的属性:preload;preload 属性规定是否在页面加载后载入音频.有4个值:auto - 当页面加载后载入整个音频meta - 当页面加载 ...

  2. 解决ubuntu下firefox无法在线播放音频和视频的问题

    原因 Ubuntu 为了规避专利和版权问题,很多东西没有预装,比如音视频解码器AAC. 那么为什么明明 Ubuntu 上没有AAC解码器, Chrome 却可以正常播放呢,自然的想法是 Chrome ...

  3. 多浏览器播放wav格式的音频文件

    html5的audio标签只在火狐下支持wav格式的音频播放,无法兼容IE和google , 使用audioplayer.js 基本上能支持大部分浏览器播放wav音频文件,经测试IE.火狐.googl ...

  4. 解决移动端浏览器 HTML 音频不能自动播放的三种方法

    https://blog.csdn.net/PY0312/article/details/90349386 由于Android,IOS移动端的浏览器以及微信自带的浏览器为了用户更好的体验,规定不自动播 ...

  5. 解决Chrome浏览器无法自动播放音频视频的问题，Uncaught (in promise) DOMException

    转载自:http://www.nooong.com/docs/chrome_video_autoplay.htm 在最新版的Chrome浏览器(以及所有以Chromium为内核的浏览器)中,已不再允许 ...

  6. egret 篇——关于ios环境下微信浏览器的音频自动播放问题

    前段时间公司突然想用egret(白鹭引擎)做一个金币游戏,大半个月边看文档边写吭哧吭哧也总算是弄完了.期间遇到一个问题,那就是ios环境下微信浏览器的音频自动播放问题. 个人感觉吧,egret自己封装 ...

  7. vue中解决chrome浏览器自动播放音频 和MP3语音打包到线上

    一.vue中解决chrome浏览器自动播放音频 需求 有新订单的时候,页面自动语音提示和弹出提示框: 问题 chrome浏览器在18年4月起,就在桌面浏览器全面禁止了音视频的自动播放功能.严格地来说, ...

  8. html5页面怎么播放音频和视频

    html5页面怎么播放音频和视频 一.总结 一句话总结:html5 音频和视频标签:(audio And video),局限是不同浏览器对音频视频的格式支持很让人头痛 1.最基础的音频和视频标签的使用 ...

  9. jquery自动播放音频文件

    使用jquery自动播放音频文件 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

随机推荐

  1. ['1', '2', '3'].map(parseInt) what & why ?

    这是今天在 Advanced-Frontend组织 看到一个比较有意思的题目.主要是讲JS的映射与解析早在 2013年, 加里·伯恩哈德就在微博上发布了以下代码段: ['10','10','10',' ...

  2. redis 漏洞造成服务器被入侵-CPU飙升

    前言   前几天在自己服务器上搭了redis,准备想着大展身手一番,昨天使用redis-cli命令的时候,10s后,显示进程已杀死.然后又试了几次,都是一样的结果,10s时间,进程被杀死.这个时候我还 ...

  3. Mysql高手系列 - 第20篇：异常捕获及处理详解（实战经验）

    Mysql系列的目标是:通过这个系列从入门到全面掌握一个高级开发所需要的全部技能. 这是Mysql系列第20篇. 环境:mysql5.7.25,cmd命令中进行演示. 代码中被[]包含的表示可选,|符 ...

  4. ELK 学习笔记之 elasticsearch环境搭建

    ELK概述: ElasticSearch是个开源分布式搜索引擎,它的特点有:分布式,零配置,自动发现,索引自动分片,索引副本机制,restful风格接口,多数据源,自动搜索负载等 Logstash是一 ...

  5. Java字段初始化规律

    首先先附上一段代码:public class InitializeBlockDemo { public static void main(String[] args) { InitializeBloc ...

  6. 04-12 scikit-learn库之随机森林

    目录 scikit-learn库之随机森林 一.RandomForestClassifier 1.1 使用场景 1.2 代码 1.3 参数 1.4 属性 1.5 方法 二.RandomForestRe ...

  7. SSH服务协议

    1.SSH介绍: SSH 是Secure Shell Protocol 的简写,由IETF网络小组(Network Working Group)制定:在进行数据传输之前,SSH先对联机数据包通过加密技 ...

  8. 深度长文回顾web基础组件

    什么是Serlvet ? 全称 server applet 运行在服务端的小程序: 首先来说,这个servlet是java语言编写的出来的应用程序,换句话说servlet拥有java语言全部的优点,比 ...

  9. Eclipse 创建 Maven 项目

    本人也是新手小白,在创建 Maven 项目的时候几乎踩完了所有的坑.特此总结如下: 1.咱先选中 File -> New -> Maven Project 2.然后如下图    在这里说明 ...

  10. PHP array_fill_keys

    1.函数的作用:将一个数组的元素分别作为键值和一个指定的值组成新的数组: 2.函数的参数: @params array  $array @params mixed $values 3.例子: < ...