Forum Discussion
Here's an easy way to create a fullscreen button in Storyline
Hey all,
Just thought I'd pass along this tip for anyone that wants their users to view their courses in fullscreen.
Here's the example: https://360.articulate.com/review/content/47627759-c0a4-4921-a49a-785772d2f07a/review
To add it yourself, just add this "Execute Javascript" Code to any object and you're good to go.
var elem = document.documentElement;
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) { /* Safari */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE11 */
elem.msRequestFullscreen();
}
}
function closeFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) { /* Safari */
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) { /* IE11 */
document.msExitFullscreen();
}
}
if(document.fullscreenElement == null){
openFullscreen();
}else{
closeFullscreen();
};
Cheers,
Andrew
There is a variable for fullscreen just toggle it
3 Replies
- AndrewMaranta-2Community Member
Yup, they added this functionality now, so no need to use my JS anymore :)
- PhilMayorSuper Hero
There is a variable for fullscreen just toggle it
- JadeGillamCommunity Member
Thank you AndrewMaranta-2! In the past, I have used this script in my Storyline projects by allocating it to a Javascript trigger that executes when a full-screen button is clicked. It has worked wonderfully.
Recently though, I've had issues with it not working properly; it will only work (ie toggle to full-screen) the first time the button is clicked. When clicked a second time, it toggles back to its original size, but after that won't revert to full-screen size any more. I can't work out why this happens. Would you have any ideas you might be able to share? Thank you 🙏
Related Content
- 11 months ago