带有 HTML5 视频的 Firefox/Gecko 全屏 API (javascript/jQuery)

发布于 2024-12-08 00:34:12 字数 1176 浏览 0 评论 0原文

我想知道是否有人可以向我提供如何使用 Firefox 新的全屏（不仅仅是全窗口）模式 API 的示例 javascript/jquery 代码（请参阅下面的链接）。基本上我想单击一些会使视频全屏显示的内容。

基于API，看起来我应该能够做一些我知道在Safari（和Chrome的开发版本）中工作的事情：

$(function(){
    $('#full').click(function(){
        var video_player = document.getElementById("video");
        video_player.onwebkitfullscreenchange = function (){}; 
        video_player.webkitRequestFullScreen();
    });
});

更新正如亚历山大建议的那样，今晚（11/10/11）我安装了 Firefox 10 的“Nightly”版本，以下代码现在可以运行：

$(function(){
    $('#full').click(function(){
        var video_player = document.getElementById("video");           
        void video_player.mozRequestFullScreen(); //firefox nightly build as of 11/10/11
    });
});

http://blog.pearce.org.nz /2011/11/firefoxs-html-full-screen-api-enabled.html

https://wiki.mozilla.org/index.php?title=Gecko:FullScreenAPI #requestFullScreen_method

原文

I'm wondering if anyone can provide me with example javascript/jquery code of how to use Firefox's new fullscreen (NOT just full window) mode API (see link below). Basically i'd like to click something that would cause the video to go full screen.

Based on the API it looks like i should be able to do something like what i know works in Safari (and Dev builds of Chrome):

$(function(){
    $('#full').click(function(){
        var video_player = document.getElementById("video");
        video_player.onwebkitfullscreenchange = function (){}; 
        video_player.webkitRequestFullScreen();
    });
});

UPDATE As suggested by Alexander, tonight (11/10/11) I installed the "Nightly" build of Firefox 10 and the following code now works:

$(function(){
    $('#full').click(function(){
        var video_player = document.getElementById("video");           
        void video_player.mozRequestFullScreen(); //firefox nightly build as of 11/10/11
    });
});

http://blog.pearce.org.nz/2011/11/firefoxs-html-full-screen-api-enabled.html

https://wiki.mozilla.org/index.php?title=Gecko:FullScreenAPI#requestFullScreen_method

分享到QQ

分享到微博