(一)audio音频标签

<audio src="xxx.mp3"></audio>

(二)video视频标签

<video src="xxx.mp4"></video>

(三)使用video代替audio

    (1) 有时候audio标签被屏蔽,不能被浏览器解释通过,可以选择使用video来代替:

<video src="xxx.mp3"></video>

    (2) 若想要将音乐作为bgm自动、循环播放,可以这样设置:

<video src="xxx.mp3" autoplay loop controls></video>

    (3) 隐藏播放控件、隐藏整个标签,可以这样设置:

<video src="xxx.mp3" autoplay loop  style="display: none;"></video>  
//去掉controls属性,并添加display:none;样式

    (4)  隐藏iso/Android下自动全屏播放时的控件,可以在css中这样设置:

 video::-webkit-media-controls{
  display:none !important;
}

    (5) iso/Android下自动全屏播放,短暂黑屏问题,可以这样处理:

<video src="xxx.mp3" autoplay loop webkit-playsinline playsinline x5-playsinline x-webkit-airplay="allow" style="display: none;"></video>

audio与video控件/标签的隐藏,iso/Android下自动全屏播放,短暂黑屏问题的更多相关文章

  1. 利用来JS控制页面控件显示和隐藏有两种方法

    利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一:  1 2 document.getEle ...

  2. Android Visibility控件显示和隐藏

    Android控件显示和隐藏 visibility 可见(visible) XML文件:android:visibility="visible" Java代码:view.setVi ...

  3. 控制器隐藏了导航 下页pop 导航位置看到黑条

    控制器隐藏了导航 下页pop 导航位置看到黑条 解决: -(void)viewWillDisappear:(BOOL)animated{        [super viewWillDisappear ...

  4. 微信小程序 audio组件 默认控件 无法隐藏/一直显示/改了controls=‘false’也没用2019/5/28

    <audio>默认控件,如果需要隐藏,不需要特意设置controls = 'false',直接把这个属性删除即可,不然无论如何都会存在 之前,设置了controls = 'false' & ...

  5. 使用jQuery和CSS自定义HTML5 Video 控件 简单适用

    Html5 Video是现在html5最流行的功能之一,得到了大多数最新版本的浏览器支持.包括IE9,也是如此.不同的浏览器提供了不同的原生态浏览器视频空间.我们制作自定义视频控件为了在所有的浏览器中 ...

  6. Android 控件的显示隐藏上下左右移动动画

    一.利用Android提供的左右移动工具类:AnimationUtils 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 LinearLayout ll_fi ...

  7. IOS 学习笔记(4) 控件 标签(UILabel)的使用方法

    虽说Label的中文翻译是标签标记,但它其实是一个静态文本内容的展现控件. 一般来说,UILabel只是一个只读的文本视图,开发者可以利用UiLabel来展示内容长度有固定上限的文字内容.并且,UIL ...

  8. C#自绘蒙版控件,带延时隐藏显示,拷贝底图功能

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Drawing; u ...

  9. Android控件显示和隐藏

    Android控件都有visibility属性,该属性有三个可能值:visible.invisible.gone.可以通过预设或是Java程序控制这些控件的显示或隐藏. 一.在XML配置文件设置 可见 ...

随机推荐

  1. commandArgument用于绑定一个传递的参数

    CommandArgument ='<%#Eval("spid")+","+Eval("piaohao")%>'

  2. C# 把字符串类型日期转换为日期类型(转载)

    C# 把字符串类型日期转换为日期类型   来源:https://www.cnblogs.com/raincedar/p/7009243.html 方法一:Convert.ToDateTime(stri ...

  3. c#实战开发:以太坊Geth 命令发布智能合约 (五)

    Token的合约代码我们参考Token-Factory的代码. 打开  https://remix.ethereum.org/#optimize=false&version=soljson-v ...

  4. java_异常

    一.什么是异常? 1.当程序”运行后”,当jvm遇到一些无法处理的情况,例如:整数/0,这就表示jvm遇到一种”异常情况”. 通常jvm能够识别这些异常并在控制台打印异常信息,并结束程序 2.为了解决 ...

  5. java爬虫系列第三讲-获取页面中绝对路径的各种方法

    在使用webmgiac的过程中,很多时候我们需要抓取连接的绝对路径,总结了几种方法,示例代码放在最后. 以和讯网的一个页面为例: xpath方式获取 log.info("{}", ...

  6. noi.ac#309 Mas的童年(子集乱搞)

    题意 题目链接 Sol 记\(s_i\)表示前\(i\)个数的前缀异或和,我们每次相当于要找一个\(j\)满足\(0 < j < i\)且\((s_i \oplus s_j) + s_j\ ...

  7. android WebView技术笔记(存储技术)

    作为刚刚开始工作的新手程序猿,各种知识还不算熟练,所以将学习到的知识记录一下以免以后忘记. WebView加载h5的知识现在可以说非常的常用,通过加载h5的网页可以在不更新app的情况下来更新app的 ...

  8. AndroidStudio使用问题记录

    问题: Gradle sync failed: Connection timed out: connect Consult IDE log for more details (Help | Show ...

  9. TCP点对点转发的实现与原理(nodejs)

    Nagent Nagent是TCP点对点转发实现,名称来源于Nat与Agent的组合.类似frp项目,可以在局域网与互联网提供桥梁. 前提是你要有一台流量服务器并且有一个公网IP.如果没有,也可以找服 ...

  10. oracle sql developer 出现 : 适配器无法建立连接问题解决方案 The Network Adapter could not establish the connection

    直接上图比较直观 tips one:先看看自己 控制台的 SQLplus 可以登录不 可以直接往下面走 ,如果不可以就现在服务里面找到 Oracle 开头的服务启动就好 实在不会可以百度 注:由于该步 ...