标签: html5-video

这一整天都在扼杀我,但我不知道如何让html5视频播放器在没有原生控件的情况下工作.

我想要没有任何控件,但如果我不包含它们,视频似乎不想播放,即使我在下面添加一些javascript试图强制它播放,它适用于iPhone和多个浏览器,但不是iPad这是奇怪的,任何想法？

如果它有帮助,这里有一些标记!

<video src="video.mp4" id="video" poster="image.jpg" onclick="this.play();"/></video>

$('#video').click(function(){
   document.getElementById('video').play();
});

无论如何只有当用户在浏览器视口中拥有视频(或视频的某个百分比)时才能自动播放HTML5视频？

我想在CSS3中使用视频作为背景.我知道没有背景视频属性,但是可以做这种行为.使用全尺寸视频标签无法提供所需结果,因为需要在视频上显示内容.

它必须是非JS.如果不可能,那么我需要在我的服务器上进行更改,结果也是视频的屏幕截图.

我需要视频来替换彩色框:

彩色框只是atm,CSS框.

我一直在为我玩的在线游戏创建一个网站.在标题中,我有一个HTML5视频播放非常短暂(1秒).在Internet Explorer中没有问题,但是在Chrome中,由于视频正在加载,因此会出现非常短暂的黑屏闪烁.有什么方法可以删除这个闪光灯,或者,如果没有这个,让它变成白色以匹配背景？你可以在这里看到我的意思http://testingfortagpro.meximas.com/.如果您在IE和Chrome中试用它,您会看到视频加载方式的差异.或者有没有更好的方法来实现这个？我尝试使用动画GIF,但质量显着降低.

谢谢!

我正在研究HTML5视频播放器自动化(测试页面是一个html页面).我试着myPlayer.Play()通过Javascript 打电话.但是,在Android上,我收到此错误:

无法在'HTMLMediaElement'上执行'play':API只能由用户手势启动.

发送Play()请求后

我知道autoplay在很多设备上都是为了节省用户带宽而禁用的.但第一次Play()似乎还需要用户手势.为此我的解决方法是什么,以便我可以自动测试播放器设备？

我有一个视频,客户想要"无缝地"坐在网站上.视频的背景HEX颜色与网站的HEX背景颜色相匹配,并在某些浏览器中呈现,某些版本,某些时候？

最令人好奇的是Chrome以不同方式呈现视频背景,直到您打开颜色选择器.然后他们突然匹配.要清楚,它只在我打开颜色选择器而不是调试器时修复它(读:这不是重新绘制的问题).

当我第一次导航到网站时,Firefox呈现的方式不同,但如果我点击cmd + r,它就变得完全无缝.

看一下屏幕截图 - 他们说的话多于我能说的话.

我正在说服客户改变视频的白色背景,因为这肯定会"修复"它,但我对这是怎样/为什么会发生这种情况非常好奇.

你在巫师的任何见解？

Codepen:http://codepen.io/anon/pen/zrJVpX

<div class="background" style="background-color: #e1dcd8; width: 100%; height: 100%;">
<div class="video-container">
    <video id="video" poster="" width="90%" height="auto" preload="" controls style="margin-left: 5%; margin-top: 5%;">
      <source id="mp4" src="http://bigtomorrowdev.wpengine.com/wp-content/themes/bigtomorrow/images/videos/bt-process.mp4" type="video/mp4">
      <source id="webm" src="http://bigtomorrowdev.wpengine.com/wp-content/themes/bigtomorrow/images/videos/bt-process.webm" type="video/webm">
      <source id="ogg" src="http://bigtomorrowdev.wpengine.com/wp-content/themes/bigtomorrow/images/videos/bt-process.ogv" type="video/ogg">
      We're sorry. This video is unable to be played on your browser.
      </video>
    </div>
</div>

我有一些代码用于在iframe中显示视频.如果用户想要在任何浏览器中切换到全屏模式,99%的时间都有效.

但是,我们在IE中找到了几个示例,其中全屏选项仅扩展为适合iframe的大小.

iframe标记呈现如下:

<iframe id="FrameContent" allowtransparency="true" frameborder="0" title="" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen="true" src="/whatever.aspx" style="width: 1660px; height: 867px; visibility: visible;"></iframe>

所有父/子iframe都具有上述allowfullscreen属性.

然而,从这里和其他地方阅读,似乎共识是allowfullscreen仅使用,具有="true"指定.上面的一些代码将被更改为渲染如下 -

<iframe id="FrameContent" allowtransparency="true" frameborder="0" title="" allowfullscreen src="/whatever.aspx" style="width: 1660px; height: 867px; visibility: visible;"></iframe>

此外,其他(webkitallowfullscreen和mozallowfullscreen)似乎已被弃用,因此不再需要,这是正确的吗？

我见过其他建议,比如使用allowfullscreen="allowfullscreen"或allowfullscreen=""(因为="true"不起作用!)

我也看过msallowfullscreen和oallowfullscreen,我们目前没有使用它们.

任何人都能够澄清应该一劳永逸地使用什么？

我用asp.net开发了一个移动页面来播放mp4视频.

我知道iOS已禁用自动播放功能以最小化用户带宽,那么我如何在Android上自动播放HTML5 mp4视频？

我已经将自动播放放在HTML5代码中,但它不起作用.

以下是我的代码:

<video autoplay controls id='video1' width='100%' poster='images/top_icon.png' webkitEnterFullscreen poster preload='true'>
<source src='http://192.xxx.xxx.xx/XXXXVM01.mp4' type='video/mp4; codecs='avc1.42E01E, mp4a.40.2' >
</video>

此外,我已经解决了用户点击图像叠加层可以播放视频的问题.谢谢Karthi

这是代码:

<script type="text/javascript">
    $(document).ready(function() {
    $("#video1").bind("click", function() {
    var vid = $(this).get(0);
    if (vid.paused) { vid.play(); }
    else { vid.pause(); }
    }); 
}); 
</script>

谢谢

乔

我搜索了很多但没有解决我的问题.

我有一个video标签运行如下:

<video 
  class="ne" 
  src="{{ page | video_url }}" 
  muted="true" 
  volume="0"  
  controls 
  width="720" 
  height="480" 
  poster="{{ page | video_poster_image_url }}" 
  type="video/mp4">
</video>

我正在使用Jekyll作为URL.他们工作正常.

该网站现已在switzerlandllc.com上发布.点击FF中的任何视频,它会显示图片和X. Chrome和其他浏览器工作正常.

如果您获取视频源并将其加载到新选项卡中,则可以正常播放.至少它对我有用.

我已经添加了:

AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm

到我的htaccess档案.我怀疑我不需要.ogv或.webm.

我不明白为什么加载视频网址会播放视频很好但是将视频加载到视频标签中会失败.

有任何想法吗？

有没有可以在html5视频元素中播放H.265/MPEG-4 HEVC编解码器的网络浏览器？在什么平台或硬件上？

当硬件解码可用时,我听到有关Edge中HEVC支持的传闻.随着当前的GPU和CPU与HEVC硬件解码一起出货,我想知道其他浏览器供应商正在关注哪些.对于H.264,Firefox已经像这样工作了