开发者

Simulate F11 with javascript

How can I simulate F11 (fullscreen not maximaze browser window) as with flash: http://www.broculos.net/files/articles开发者_C百科/FullscreenFlash/flashFullscreen.html ?

in flash: fscommand("fullscreen", true )

permadi.com/tutorial/flash9FullScreen/index.html

Thanks

Update

I found this:

var docElm = document.documentElement;

if (docElm.requestFullscreen) {
    docElm.requestFullscreen();
} else if (docElm.mozRequestFullScreen) {
    docElm.mozRequestFullScreen();
} else if (docElm.webkitRequestFullScreen) {
    docElm.webkitRequestFullScreen();
}

/* Exiting the full screen => showing the FULL SCREEN button */
if (docElm.requestFullscreen) {
    document.addEventListener("fullscreenchange", function () {
        if(!document.fullscreen) {
            // Do something
        }
    }, false);
} else  if (docElm.mozRequestFullScreen) {
    document.addEventListener("mozfullscreenchange", function () {
        if(!document.mozFullScreen) {
            // Do something
        }
    }, false);
} else if (docElm.webkitRequestFullScreen) {
    document.addEventListener("webkitfullscreenchange", function () {
        if(!document.webkitIsFullScreen) {
            // Do something
        }
    }, false);
}

this only works (from what've seen) only on a button click. Can't do this on page load


This isn't possible with JavaScript. It was proposed for the HTML5 video API but was later scrapped.


There is a very basic tutorial on Mozilla:

  • https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Using_full_screen_mode

Please note that as of this post this is "experimental technology".

function requestFullScreen(elt) {
    console.log("Requesting fullscreen for", elt);
    if (elt.requestFullscreen) {
        elt.requestFullscreen();
    } else if (elt.msRequestFullscreen) {
        elt.msRequestFullscreen();
    } else if (elt.mozRequestFullScreen) {
        elt.mozRequestFullScreen();
    } else if (elt.webkitRequestFullscreen) {
        elt.webkitRequestFullscreen();
    } else {
        console.error("Fullscreen not available");
    }
}

I was able to test this out successfully with div, video and canvas elements. Here is the code in jsfiddle -- http://jsfiddle.net/luken/001834wn/ -- but note that it does not actually work in jsfiddle for some reason.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜