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類的開關。