Hello,
I'm trying to find a way to to simply click an image (which is a button) to toggle the whole project (and every successive image as well) in fullscreen mode, for cross-webbrowser. I also like to force it in landscape mode on mobile browsers. I have little knowledge about implementing the fullscreen API into my code. Any help (example project) is very much appreciated.
Thx in advance.
You want the requestFullscreen API. Unfortunately most browser makers haven't standardized on what to call it yet, so using it is kind of a pain. This seems to work:
this.myButton.addEventListener("click", doFullscreen);
function doFullscreen() {
var i;
var elem = document.getElementById("animation_container");
var fs = ["requestFullscreen", "webkitRequestFullscreen", "mozRequestFullScreen", "msRequestFullscreen"];
for (i = 0; i < 4; i++) {
if (elem[fs]) {
elem[fs]();
break;
}
}
}
In Animate your content won't stretch to full screen size unless you have it set to fill the screen in the publish settings.
If you want to detect whether the fullscreen attempt succeeded, and provide a button for un-fullscreening, it gets even more complicated.
Already have an account? Login
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.
AdChoices