FullScreen Icon for window

[IvanNov7]

Hi everyone,
I want to add full screen trigger option on model-viewer.
Some small icon that will make the iframe or whole windows fullscreen mode on desktop and mobile.
Is there any option for this right now?
Thank you

[elalish]

There is a generic fullscreen API on the web, which I believe should work the same way for model-viewer as for any other DOM element. We don't build in any special affordance.

[Nehssie]

I want to add full screen trigger option on model-viewer. Some small icon that will make the iframe or whole windows fullscreen mode on desktop and mobile.

Were you ever able to figure this out? I need to do the same thing. If anyone can help, I'd greatly appreciate it. I am a visual learner, and video tutorials (if at all possible) are best for me to learn from. Thanks in advance.

[NEX-Reality]

#1900 Below function will work.

function toggleFullscreen() { const elem = document.documentElement; if (!document.fullscreenElement) { if (elem.requestFullscreen) { elem.requestFullscreen(); } else if (elem.mozRequestFullScreen) { // Firefox elem.mozRequestFullScreen(); } else if (elem.webkitRequestFullscreen) { // Chrome, Safari, Opera elem.webkitRequestFullscreen(); } else if (elem.msRequestFullscreen) { // IE/Edge elem.msRequestFullscreen(); } } else { if (document.exitFullscreen) { document.exitFullscreen(); } else if (document.mozCancelFullScreen) { // Firefox document.mozCancelFullScreen(); } else if (document.webkitExitFullscreen) { // Chrome, Safari, Opera document.webkitExitFullscreen(); } else if (document.msExitFullscreen) { // IE/Edge document.msExitFullscreen(); } } }

[Nehssie]

Where exactly do you put this?

[bozvary]

I also try to figure out the best way to do it, the desktop(/tabs) version is fine you can use the fullscreen API , but on mobile, there is no such thing as "fullscreen", so this part is more tricky. My approach to put a button in/on the iframe and on button click, extend the iframe size to near fullscreen (95% width, 95vh height), otherwise the issue is the scrolling. The embedded modelviewer will take over the control when you want to scroll the page.

Any other idea?