(一)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. .Net Core 实践 - 如何在控制台应用(.Net Core)使用appsettings.json配置

    新建控制台应用(.Net Core)程序 添加json文件,命名为appsettings.json,设置文件属性 如果较新则复制.添加内容如下 { "MyWords" : &quo ...

  2. 【并发编程】Future模式及JDK中的实现

    1.1.Future模式是什么 先简单举个例子介绍,当我们平时写一个函数,函数里的语句一行行同步执行,如果某一行执行很慢,程序就必须等待,直到执行结束才返回结果:但有时我们可能并不急着需要其中某行的执 ...

  3. UML学习——类之间的关系

    参考:UML图中类之间的关系:依赖,泛化,关联,聚合,组合,实现 空心菱形为聚合关系:部分与整体,部分可有可无.部分可以单独存在(车子和引擎,引擎可以单独存在) 实心菱形为组合关系:部分与整体,但是部 ...

  4. Fundebug支持浏览器报警

    摘要: 除了邮件报警和第三方报警,我们新增了浏览器报警功能. 邮件报警与第三方报警 Fundebug是专业的应用BUG监控服务,当您的线上应用,比如网页.小程序.Java等发生BUG时,我们会第一时间 ...

  5. Vue 单选框与单选框组 组件

    radio组件 v-model  : 通过当然绑定的值与input上的value值来确定当前选中项. 在父作用域中通过active设置当前默认选中项,如果选中项发生改变后通过input事件通知传递到父 ...

  6. NextCloud前端支持播放mov文件

    默认情况下,NextCloud网盘是不支持播放 .mov文件的. 通过修改前端代码就可以实现. 如下 1 找到 apps/files_videoplayer/js/viewer.js 文件 2 搜索 ...

  7. Spark MLlib KMeans 聚类算法

    一.简介 KMeans 算法的基本思想是初始随机给定K个簇中心,按照最邻近原则把分类样本点分到各个簇.然后按平均法重新计算各个簇的质心,从而确定新的簇心.一直迭代,直到簇心的移动距离小于某个给定的值. ...

  8. MySQL下载与MySQL安装图解(MySQL5.7与MySQL8.0)

    MySQL下载与MySQL安装图解(MySQL5.7与MySQL8.0) 1.MySQL下载(MySQL8.0社区版) mysql下载方法,请根据风哥以下步骤与图示来下载mysql8.0最新社区版本: ...

  9. 基于android的天气预报的设计与实现

    目录 应用开发技术及开发平台介绍 应用需求分析 应用功能设计及其描述 应用UI展示 ①开发技术: 本系统是采用面向对象的软件开发方法,基于Android studio开发平台,以Android作为本系 ...

  10. 光盘安装win7系统教程

    光盘安装系统是最传统的安装系统的方法,虽然现在U盘安装和硬盘安装已经很方便,但仍有很多用户习惯光盘安装的方式,下面小编教大家如何利用光盘安装系统. 来源:https://www.haoxitongx. ...