隐藏原生html5 video controls

凤凰视频焦点项目mobile html5播放器测试时bug,由于没有用原生的controls而是自己写的custom controls,虽然设置了controls的值为false,但实际情况是比如暂停还是存在,导致与custom的重叠. 协助同事解决这个bug时还好找到了这篇文章(有空完整翻译下.=.=)

Hiding Native HTML5 Video Controls in Full-Screen Mode

呐,解决办法就是

video::-webkit-media-controls {

  display:none !important;

}

没错css,知道真相后泪流不止啊.这么设置后即使没有设置controls为false，native controls也不会再出现了.

参考

html5 video api

video属性及方法列表

隐藏原生html5 video controls的更多相关文章

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

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

  2. 移动端HTML5<video>视频播放优化实践

    遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...

  3. 移动端HTML5<video>视频播放优化实践[转]

    http://blog.csdn.net/u010918416/article/details/52705732 http://www.xuanfengge.com/html5-video-play. ...

  4. Html5 Video 实现方案

    来源:http://ask.dcloud.net.cn/article/569 源码下载 前言: 最近项目中需要用到html5 视频播放功能,于是稍微研究了解了下,遇到了很多坑,特此记录下. 一. H ...

  5. 移动端 HTML5 <video> 视频播放优化实践

    遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...

  6. [转]移动端HTML5<video>视频播放优化实践

    遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...

  7. DCloud-Video：Html5 Video 实现方案

    ylbtech-DCloud-Video:Html5 Video 实现方案 1.返回顶部 1.1. http://ask.dcloud.net.cn/article/569 1.2. 一. Html5 ...

  8. html5 video

    先简要概述一下video标签: video:嵌入视频到页面中 1. 声明video标签 单个视频的时候使用src: <video src="http://v2v.cc/~j/theor ...

  9. HTML5 video标签播放视频下载原理

    HTML5 video https://github.com/remy/html5demos/blob/master/demos/video.html <video preload=" ...

随机推荐

  1. ftl 问题

    取不到后台数据,这里是因为 page 已经是关键字

  2. win10 pro 1511 激活成功

    slmgr /ipk W269N-WFGWX-YVC9B-4J6C9-T83GX slmgr /skms franklv.ddns.net slmgr /ato

  3. 使用git 更新线上代码

    先本地代码合并://1合并分支git branch//2查看taggit tag //3添加tagcloud_crm]$ git tag -a v1.0.2 -m "0902"// ...

  4. 日常开发使用GIT命令

    git是一种分布式的版本管理工具,现在我总结下日常使用的git命令 1)检出 git clone 地址 --检出代码 #这里的地址是代码池的地址,如Github或bitbucket 2)增加文件 gi ...

  5. struts 文件下载

    =============================struts 文件下载  ================================== 步骤一: JSP页面 <a href=& ...

  6. 捷波朗 jabra BT3030 蓝牙耳机

    蓝牙版本V2.0 通话时间 8小时 按键说明:轻敲 快按轻敲两下 在1.5秒内快速按两下按 大约 1秒钟按住 大约 4秒钟 充电提示绿灯闪亮 正在充电持续绿灯 已完全充满电 检查电量按 音量上调(+) ...

  7. linux sed

    sed 命令 sed -i 's/3306/3308/g' my.cnf mysql # 同时替换两个文件

  8. Time crumbles things; everything grows old under the power of Time and is forgotten through the lapse of Time

    Time crumbles things; everything grows old under the power of Time and is forgotten through the laps ...

  9. unity3d随机地牢生成代码

    现在也是处于失业状态,碰巧看到个面试题是要用unity生成个随机地牢,就把做题过程中的思路和代码记录一下吧. 做完了以后我又想了一下,发现其实根本不需要这么麻烦,果然demo里的代码对我的思路影响还是 ...

  10. 在webapp上使用input:file, 指定capture属性调用默许相机，摄像，录音功能

    ## 在webapp上使用input:file, 指定capture属性调用默认相机,摄像,录音功能 在iOS6下开发webapp,使用inputz之file,很有用 <input type=& ...