Firefox 3.6视频全屏控件

Question

Firefox现在支持视频html5标签上的全屏模式。 （右键点击电影..）

有没有什么办法来创建一个控制（html标签）来做这个像这个play/pause例子（使用js）？

<script> 
function play(){ 
var video = document.getElementById('movie'); 
var play = document.getElementById('play'); 

play.addEventListener('click',playControl,false); 
function playControl() { 
    if (video.paused == false) { 
     video.pause(); 
    this.firstChild.nodeValue = 'Play'; 
    pauseCount(); 
} else { 
    video.play(); 
    this.firstChild.nodeValue = 'Pause'; 
    startCount(); 
} 
} 
} 

Answer 1

基本上所有你需要的是建立在您指定的位置的功能（由一个全屏按钮触发）：绝对的，和较高的z-index到视频包装

的你将分配视频和视频包装的宽度和高度：100％（或如果你喜欢固定大小）

可能实现此行为的最佳方式是定义一个类（例如全屏）并将其分配给容器，像

.fullscreen { 
    position : absolute; 
    z-index : 1000; 
    width : 100%; 
    height : 100%; 
    top  : 0; 
    left  : 0; 
} 

.fullscreen video { 
    width : 100%; 
    height : 100%; 
} 

所以函数调用（全屏/普通视图）是.fullscreen类的开关。