I looked following articles and jquery plugins
http://www.sitepoint.com/html5-full-screen-api/
http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/
http://xme.im/display-fullscreen-website-using-javascript
http://feross.org/html5-fullscreen-api-attack/
http://jquery.pupunzi.com/questions/696/ie-containerplus-full-screen
IE Chrome Frame Full Screen
But couldnt find.
All those major articles refereed, but I couldn't find any article which directly talking about IE full-screen feature, Any one found workaround to the same?
I tried W3C proposal
// W3C Proposal
element.requestFullscreen();
document.exitFullscreen();
UPDATED My expectation is, I have an image carousel, I need to show current selected image to show in full screen, seems to IE doesn't support, I plan to use jQuery model window(without jQuery UI). Just as the example.
sheelpriy answer is good with a small change, successfully tested on chrome, firefox, ie, safari and opera (all last version)
//HTML Button : <a href="#" id="fullscreen">Fullscreen</a>
<script type="text/javascript">
//Get element id "fullscreen"
var fullScreenButton = document.getElementById("fullscreen");
//Activate click listener
fullScreenButton.addEventListener("click", function () {
//Toggle fullscreen off, activate it
if (!document.fullscreenElement && !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement ) {
if (document.documentElement.requestFullscreen) {
document.documentElement.requestFullscreen();
} else if (document.documentElement.mozRequestFullScreen) {
document.documentElement.mozRequestFullScreen(); // Firefox
} else if (document.documentElement.webkitRequestFullscreen) {
document.documentElement.webkitRequestFullscreen(); // Chrome and Safari
} else if (document.documentElement.msRequestFullscreen) {
document.documentElement.msRequestFullscreen(); // IE
}
//Toggle fullscreen on, exit fullscreen
} else {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
}
}
});
</script>
Enjoy !
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With