从videojs.com的文档中,我的印象是我需要包含ogv和webm文件格式(除了mp4).
然后我读了http://www.htmlgoodies.com/html5/client/how-to-embed-video-using-html5.html#fbid=erNepglDbZl,看起来我只需要mp4和(ogv或webm).
什么是正确的?我需要这三个吗?
我需要覆盖包含HTML 5视频的div的div ON TOP.在下面的示例中,重叠的div的id是"video_overlays".见下面的例子:
<div id="video_box">
<div id="video_overlays"></div>
<div>
<video id="player" src="http://video.webmfiles.org/big-buck-bunny_trailer.webm" type="video/webm" onclick="this.play();">Your browser does not support this streaming content.</video>
</div>
</div>Run Code Online (Sandbox Code Playgroud)
是否有可能寻找html5 video网页中显示的特定点?我的意思是,我可以输入一个特定的时间值(比方说01:20:30:045)并让玩家控制(滑块)移动到该点并从那一点开始玩吗?
在旧版本的mozilla中vlcplugin我认为这可以通过方法实现seek(seconds,is_relative)..但我想知道这是否可以在html视频中使用.
编辑:
我创建了带有视频的页面,并添加了如下所示的javascript.当我点击链接时,它会显示点击的时间..但它不会增加播放位置..但继续正常播放.
视频播放位置不应该更改吗?
HTML
<video id="vid" width="640" height="360" controls>
<source src="/myvid/test.mp4" type="video/mp4" />
</video>
<a id="gettime" href="#">time</a>
<p>
you clicked at:<span id="showtime"> </span>
</p>
Run Code Online (Sandbox Code Playgroud)
JavaScript的
$(document).ready(function(){
var player = $('#vid').get(0);
$('#gettime').click(function(){
if(player){
current_time=player.currentTime;
$('#showtime').html(current_time+" seconds");
player.currentTime=current_time+10;
}
});
}
);
Run Code Online (Sandbox Code Playgroud) 我有一个视频,我想要它填充100%的宽度和100%的高度.并保持纵横比.
是否有可能它至少填充100%?如果视频的某些部分必须在屏幕之外以保持宽高比,那无关紧要.
HTML:
<video preload="auto" class="videot" id="videot" height="100%" preload>
<source src="BESTANDEN/video/tible.mp4" type="video/mp4" >
<object data="BESTANDEN/video/tible.mp4" height="1080">
<param name="wmode" value="transparent">
<param name="autoplay" value="false" >
<param name="loop" value="false" >
</object>
Run Code Online (Sandbox Code Playgroud)
CSS:
.videof, .videot {
width: 100% !important;
height: 100% !important;
}
Run Code Online (Sandbox Code Playgroud) 由于Flash正在失势,我想知道是否有办法用DRM保护html5视频(H264,.ogg和WebM).
如何检查浏览器是否支持HTML5文件上传(FormData对象)?
var fd = new FormData();
Run Code Online (Sandbox Code Playgroud)
根据这篇文章的回答,但代码没有返回关于浏览器的正确答案,
window.onload = function()
{
if (!!window.FileReader)
{
alert('supported');
}
else
{
alert('not supported');
}
}
Firefox - supported
Chrome - supported
Opera - supported
Safari - not supported
IE9 - not supported
Run Code Online (Sandbox Code Playgroud)
但正确的浏览器支持应该是,
Firefox - supported
Chrome - supported
Opera - not supported
Safari - supported
IE9 - not supported
Run Code Online (Sandbox Code Playgroud)
我已经测试了Opera上的html 5文件上传,但它无法确定.
我相信safari 支持html 5文件上传.
我有一个HTML视频,我想在视频结束时运行一个功能.我尝试过以下但我什么都没得到:
$(document).ready(function(){
$('video').live('ended',function(){
alert('video ended');
});
});
Run Code Online (Sandbox Code Playgroud)
任何想法为什么这不会在视频结束时触发?或者我没有提供足够的信息来回答这里的任何问题?
注意:我正在使用live()函数而不是on(),因为需要使用此项目的jQuery 1.7.
我想使用HTML5视频播放器并流式传输视频.S3/CloudFront可以实现吗?我了解亚马逊使用RTMP流媒体协议,而HTML5的video标签不支持RTMP.有没有办法用HTML5播放器流式传输视频?
我正在使用以下代码在页面上实现HTML5视频
<video autoplay>
<source src="/resources/video/product-hero.mp4.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
<source src="/resources/video/product-hero.webmhd.webm" type='video/webm; codecs="vp8, vorbis"' />
</video>
Run Code Online (Sandbox Code Playgroud)
这很好用,嵌入在FF,Safari和Chrome的页面上.我喜欢什么,因为这个视频没有控制,并且意味着嵌入在没有边框的页面中(视频中的白色BG)是要有一个图像代替视频.
如果无法使用元素渲染视频,我想将图像作为后备.我看过以下帖子:html5视频后备建议(没有闪存)开始讨论.但不确定这些答案是否是我所需要的.
我的直觉告诉我,我可以让JQuery检测视频功能,如果不支持视频,那么写出一些显示图像的HTML.但是我想看看是否有更简单的东西.
从理论上讲,IOS和ANDROID都会播放h.264文件,但我无法找出对它们进行编码的设置,因此它们实际上可以跨平台工作.有人知道如何使用一个文件对Android和IOS进行编码吗?
ps我知道关于html5视频和后备源的所有内容,我只是不想为每个下来的派克设备编码和托管新视频.