audio与video控件/标签的隐藏,iso/Android下自动全屏播放,短暂黑屏问题
(一)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下自动全屏播放,短暂黑屏问题的更多相关文章
- 利用来JS控制页面控件显示和隐藏有两种方法
利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位. 方法一: 1 2 document.getEle ...
- Android Visibility控件显示和隐藏
Android控件显示和隐藏 visibility 可见(visible) XML文件:android:visibility="visible" Java代码:view.setVi ...
- 控制器隐藏了导航 下页pop 导航位置看到黑条
控制器隐藏了导航 下页pop 导航位置看到黑条 解决: -(void)viewWillDisappear:(BOOL)animated{ [super viewWillDisappear ...
- 微信小程序 audio组件 默认控件 无法隐藏/一直显示/改了controls=‘false’也没用2019/5/28
<audio>默认控件,如果需要隐藏,不需要特意设置controls = 'false',直接把这个属性删除即可,不然无论如何都会存在 之前,设置了controls = 'false' & ...
- 使用jQuery和CSS自定义HTML5 Video 控件 简单适用
Html5 Video是现在html5最流行的功能之一,得到了大多数最新版本的浏览器支持.包括IE9,也是如此.不同的浏览器提供了不同的原生态浏览器视频空间.我们制作自定义视频控件为了在所有的浏览器中 ...
- Android 控件的显示隐藏上下左右移动动画
一.利用Android提供的左右移动工具类:AnimationUtils 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 LinearLayout ll_fi ...
- IOS 学习笔记(4) 控件 标签(UILabel)的使用方法
虽说Label的中文翻译是标签标记,但它其实是一个静态文本内容的展现控件. 一般来说,UILabel只是一个只读的文本视图,开发者可以利用UiLabel来展示内容长度有固定上限的文字内容.并且,UIL ...
- C#自绘蒙版控件,带延时隐藏显示,拷贝底图功能
using System; using System.Collections.Generic; using System.ComponentModel; using System.Drawing; u ...
- Android控件显示和隐藏
Android控件都有visibility属性,该属性有三个可能值:visible.invisible.gone.可以通过预设或是Java程序控制这些控件的显示或隐藏. 一.在XML配置文件设置 可见 ...
随机推荐
- PHP进程信号处理
PHP进程信号处理 php有一组进程控制函数PCNTL,使得php能在*nix系统中实现跟c一样的创建子进程.使用exec函数执行程序.处理信号等功能. 注意:pcntl这个扩展仅在cli/cgi模式 ...
- html&css学习一
HTML标签 HTML骨架 <HTML> <head> <title></title> </head> <body> </ ...
- Android远程桌面助手(B1185)for Android P开发者预览版
Android P的开发者预览版已出,其中App compatibility changes部分特别强调“The platform restricts the use of some non-SDK ...
- Numpy库的学习(三)
今天我们继续学习一下Numpy库的学习 废话不多说 ,开始讲 比如我们现在想创建一个0-14这样一个15位的数组 可以直接写,但是很麻烦,Numpy中就给我们了一个方便创建的方法 numpy中有一个a ...
- 【Linux】【MySQL】CentOS7、MySQL8.0.13 骚操作速查笔记——专治各种忘词水土不服
1.前言 [Linux][MySQL]CentOS7安装最新版MySQL8.0.13(最新版MySQL从安装到运行) 专治各种忘词,各种水土不服. - -,就是一个健忘贵的速查表:(当然不包括SQL的 ...
- 【English】七、常见动词
一.动词: touch.hear.say.listen touch [tʌtʃ] 触摸 I touch the cat. They touch the elephant. hear [hɪr] 听到 ...
- 【Oracle教程资源大合集】Oracle数据库免费学习资源汇总
Oracle的产品非常丰富,各类学习资源也五花八门,本文将介绍Oracle官方的免费教程与风哥整理的Oracle视频教程: 1.Oracle帮助中心 Oracle帮助中心也称为Oracle文档中心,这 ...
- Docker-通过docker-maven-plugin插件实现docker镜像构建并自动发布到远程docker服务器
我们知道,docker能实现应用打包隔离,实现快速部署和迁移.如果我们开发应用使用了spring cloud + spring boot架构,那么,通过docker-maven-plugin实现快速构 ...
- 位运算 leecode.389. 找不同
//给定两个字符串 s 和 t,它们只包含小写字母. //字符串 t 由字符串 s 随机重排,然后在随机位置添加一个字母. //请找出在 t 中被添加的字母 char findTheDifferenc ...
- SQL Server 事务日志文件已满,收缩日志文件(9002)
错误如下图: 1.数据库 → 属性 → 选项 → 恢复模式 → 选择‘简单’:如下图: 2.任务 → 收缩 → 文件类型‘文件’ → 收缩模式‘在释放未使用的空间前重新组织页’,将文件收缩到K,大小填 ...