Html5 全屏视频

2024-05-13

有什么办法可以做到这一点吗?我想全屏播放视频。没有浏览器。环境width:100%; height:100%;保持浏览器可见


不,目前还没有办法做到这一点。我希望他们在浏览器中添加这样的未来。

EDIT:

现在有一个全屏API http://dvcs.w3.org/hg/fullscreen/raw-file/tip/Overview.html#api用于网络你可以requestFullscreen在视频或画布元素上,要求用户授予您权限并使其全屏显示。

让我们考虑一下这个元素:

<video controls id="myvideo">
  <source src="somevideo.webm"></source>
  <source src="somevideo.mp4"></source>
</video>

我们可以使用如下脚本将该视频置于全屏模式:

var elem = document.getElementById("myvideo");
if (elem.requestFullscreen) {
  elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) {
  elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
  elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { 
  elem.msRequestFullscreen();
}

完整文档 https://developer.mozilla.org/en-US/docs/DOM/Using_fullscreen_mode

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Html5 全屏视频 的相关文章

  • 在 Fabric.js 中进行裁剪的“toDataURL”函数中,Multiplier 属性无法正常工作

    我的原始尺寸canvas is 800X700 我在用clipTo要在画布的选定部分中工作 var rect new fabric Rect left 100 top 50 fill fff width 376 height 602 str
  • 图像未完整显示在身体背景上

    例子 http jsbin com opokev 20 http jsbin com opokev 20 完整图片 http i53 tinypic com 347a8uu jpg http i53 tinypic com 347a8uu
  • 如何让更大的布局适合小设备屏幕?

    我有一个小问题meta viewport元素 问题是我的布局min width比我想要使用的许多屏幕分辨率都要大 所以将其设置为 没有帮助 结果我得到的页面必须缩小以适应设备宽度 如果我什至添加像 它也不起作用 发现了一个黑客来自CSS 技
  • ActiveX 日历控件在 Windows 7 中不起作用

    我们有一个经典的 ASP 应用程序 它使用以下日历对象
  • jQuery / javascript 缓存元素以提高效率?

    是的 所以我想常识是 对于您将要经常访问的元素 最好的方法是像这样缓存它们 var myEl myclass 然后你以后就可以访问 myEl 并且不需要再次搜索 DOM 对吗 好吧 假设我有一个相当复杂的 html 结构 我需要经常访问几个
  • 更改单选按钮上输入字段中的值

    我正在开发一个项目 用户必须在两个选项中选择一个 选项是单选按钮 目前我正在获取 keyup 事件的结果 当用户选择一个选项 然后在输入字段中输入值时 他会在另一个结果输入字段中得到结果 它工作正常 但是当用户想要更改选项并选择其他选项时出
  • 角度斜线被编码

    我和这个人有同样的问题 angularjs slash after hashbang gets encoded https stackoverflow com questions 17530924 angularjs slash after
  • 生成基于内联 HTML 样式的样式表?

    一段时间以来 我一直致力于对网站的不同部分进行样式设计 但是我尚未将内联样式放入样式表中 我想知道是否存在一个工具可以解析 HTML 文件并从中生成样式表 例如 这是我网站的一个片段 div class block style border
  • 固定 CSS 导航栏

    我最近解决了困扰我一段时间的 CSS 导航栏问题 现在我遇到了将其固定到顶部的问题 以便当您滚动页面时它会向下滚动 我知道我需要添加的是 Position fixed 但我不知道在哪里添加它 我最近的尝试导致文本被修复 但导航栏的背景却没有
  • 如何使用 JavaScript 提高音频加载速度?

    我已经创建了播放代码 mp3使用 JavaScript 文件 但该文件在 Android 上播放需要很长时间 我想在点击文本图像后快速播放声音 如何提高 Android 的加载速度 我的 JavaScript 代码 if window au
  • IE7内容可编辑自动换行

    我有以下代码 div class editable This is test text This is test text This is test text This is test text This is test text Thih
  • 差异:查看页面源代码与在 Firebug 中查看

    当我查看页面的页面源时 例如 http my sa ucsb edu public curriculum coursesearch aspx http my sa ucsb edu public curriculum coursesearc
  • CSS 背景在 iOS 中拉伸以填充高度,但滚动上有空白

    这个 CSS 让我的背景在 iOS 中填充 100 的屏幕高度 但有一个小问题 当你向下滚动时 最初有空白 然后当你松开手指并停止滚动时 背景图像会 调整 并填充 100再次屏幕高度的 如果您继续滚动 该问题不会在同一页面上再次出现 只是第
  • HTML5 网站在手机屏幕关闭时运行?

    基本上 我的问题与这个话题 https stackoverflow com questions 15465242 html5 mobile app running while phone screen is off但现在已经是 2018 年
  • HTML5 画布在缩放和旋转后平移

    我正在尝试用画布做一些事情 首先 我让用户上传图像 如果图像比我想要的大 我需要将其缩小 那部分工作得很好 最近我们遇到了 iPhone 用户上传图像的问题 这些都存在方向问题 我已经弄清楚如何提取方向 我的问题是当我操纵画布中的图像时会发
  • BS3 - img 响应类 - 为什么没有最大高度?

    引导程序 3 包括 img responsive班级 应用这些 css 设置 display block height auto max width 100 为什么没有max height 100 我发现添加这个使得图片的高度也适合 但我不
  • 在 X 轴刻度上渲染 HTML

    我想在 D3 图表的 x 轴上渲染 HTML 基本上 我希望轴上的每个标签都是到数据中另一列的超链接 我试过了 x domain data map function d return a href d Name a 但它根本不起作用 我得到
  • 不透明度如何影响元素顺序?

    我发现 CSS 有一个非常奇怪的行为opacity与浮动元素相结合 考虑以下 HTML div div Right button div div div Overlay div 最后div将覆盖前两个浮动的 删除不透明度会将最新的 div
  • 垂直滚动,与 div/元素/锚点对齐/对齐

    我发现了一些可爱的网站 http www mini jp event campaign big point http www mini jp event campaign big point http www twenty8twelve c
  • 使用 JavaScript 和 HTML 打印表情符号

    为什么这有效 p x1f604 p 而这并没有 document getElementById emoji innerHTML String fromCharCode parseInt 1f604 16 JS 术语中的 char 实际上是一

随机推荐

  • 如何为 CUDA 内核选择网格和块尺寸?

    这是一个关于如何确定CUDA网格 块和线程大小的问题 这是对已发布问题的附加问题here https stackoverflow com a 5643838 1292251 通过此链接 talonmies 的答案包含一个代码片段 见下文 我
  • Qt - 如何粘合两个窗口并将它们移动在一起?

    就像qmmp Qt 音乐播放器ui设计一样 这两个或三个窗口实际上在同一个窗口中 因为只有一个dock图标 并且这些窗口可以一起移动并相互附着 我看了源码 好像有用QDockWidget 但我真的不知道如何获得它的细节 当您手动移动辅助窗口
  • Nginx 是否也缓冲来自客户端的 http 请求?

    我知道 Nginx 可以缓冲来自上游服务器的响应 我的问题是 Nginx 是否也缓冲来自客户端的 http 请求 我的意思是 如果 Nginx 从客户端收到 http 请求 它是否立即与上游服务器建立连接 或者它会在收到整个http请求后创
  • 禁用触发 TextChanged 事件

    I have textbox我正在更改其中的文本lostFocus被解雇了 但这也激发了textChanged事件 我正在处理该事件 但我不希望在这种情况下触发它 我如何在这里禁用它 UPDATE 这个想法与bool很好 但我有几个文本框
  • 调用 event.preventDefault() 后是否有一种[通用]方法来调用默认操作?

    这个问题是为了开发 jQuery 插件和其他独立的 JavaScript 片段 不需要修改其他脚本文件来实现兼容性 我们都知道 event preventDefault 将阻止默认事件 因此我们可以运行自定义函数 但是如果我们想简单地怎么办
  • 隐藏“隧道到”会话

    我尝试隐藏 Chrome 社交部分生成的会话 但在主机列中隐藏标记为 隧道 的流量不起作用 尽管我成功地根据主机名模式隐藏了另一个会话 if oSession HTTPMethodIs CONNECT oSession ui hide y
  • 在 Swift 中将 gif 保存到 iOS 照片库

    我正在尝试保存位于已使用 Regift 代码创建的临时文件中的 GIF 图像 Regift https github com matthewpalmer Regift https github com matthewpalmer Regif
  • php 验证整数[重复]

    这个问题在这里已经有答案了 我想知道为什么这不起作用 echo gettype GET id returns string if is int GET id echo Integer 如何验证从 GET POST 传递的数据是否为整数 Ca
  • 求任意节点到一个节点的最小公共路径

    我的问题如下 我有一个 backup 节点和其他节点 从这些节点 我需要生成一个到备份节点的最小公共路径 未加权和无向图 我不需要每次都需要解决方案 我如何知道我是否可以生成这条路径 我正在考虑将图分成一些子图并搜索最小的 subpath
  • 将jquery与nodejs一起使用时的基本错误

    我正在尝试在我的项目中使用一些jquery 当我尝试使用它时 我在复制的代码中遇到了错误 并且无法获得任何有关它的谷歌帮助 var jquery require jquery var jquery create TypeError Obje
  • 自定义DataGridView列值在失去焦点后消失

    我在 WinForms 中为我的项目创建了一个自定义 DataGridViewColumn 该控件呈现完美 但一旦我输入值并移动到另一个单元格 当我签入 CellEndEdit 时 该值就会消失并显示为 null 以下是代码 class N
  • mmap() 和锁定文件

    考虑以下代码片段 故意缺少错误处理 void foo const char path off t size int fd void ret fd open path O RDWR lockf fd F LOCK 0 ret mmap NUL
  • PushReplacement 或 PushAndRemoveUntil(Route 路线) => false 不工作

    基于页面的路由无法使用命令式 api 完成 而是提供一个没有相应页面的新列表到 Navigator pages 包 flutter src widgets navigator dart 断言失败 第 3075 行 pos 7 hasPage
  • 如何在 html 5 画布上旋转单个对象?

    我试图弄清楚如何在 html 5 画布上旋转单个对象 例如 http screencast com t NTQ5M2E3Mzct http screencast com t NTQ5M2E3Mzct 我希望每一张卡都能以不同的角度旋转 到目
  • 如何使用AWK脚本检查表的所有列数据类型? [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 在这里 我正在检查表中第一列的数据类型 但我想知道AWK中表的所有列数据类型 我尝试过 但只能获得一列数据类型 例如 Column 1
  • Facebook API 错误 100 - 无效链接

    我正在使用 Facebook API 在我的 Rails 应用程序中创建发送对话框 我只是在 Javascript 中使用 Facebook 推荐的格式 作为 HTML 中的脚本 我的问题是我得到 API Error code 100 in
  • C# MonoGame 有帮助吗? (Content.Load("入侵者");)

    我正在 MonoGame 中使用 Open GL 制作太空入侵者游戏 并且尝试加载已添加到内容文件夹中的纹理 这是一个名为 Invader 的 PNG 文件 我使用的代码是 invader Content Load
  • 配置 KnpPaginator 以与 Twitter Bootstrap 配合使用

    i m trying to apply twitter bootstrap css style to my knp pagination without modifying the vendor Is there a way to conf
  • PHP MS Word 文件页数

    实际上我正在尝试计算 ms word 文件的页数 我正在使用这个 php 脚本 但是 没有向我显示确切的结果 并且脚本不是那么快 谁能帮助我获得更好的脚本 word new COM word application if word echo
  • Html5 全屏视频

    有什么办法可以做到这一点吗 我想全屏播放视频 没有浏览器 环境width 100 height 100 保持浏览器可见 不 目前还没有办法做到这一点 我希望他们在浏览器中添加这样的未来 EDIT 现在有一个全屏API http dvcs w