Turn OFF Picture-in-Picture using JavaScript
Apr 22, 2024
By
BJ
We need to turn off picture-in-picture for videos. I found this online, but I need to know how to work this for Storyline videos (not iframes). Can this work in Storyline? How would I post the source... same as other internal assets, story_content/external_files/???
<video id="vid" controls muted>
<source src="https://www.w3schools.com/html/mov_bbb.mp4">
</video>
<script>
vid=document.getElementById("vid")
vid.disablePictureInPicture = true
</script>
or
const videoElement = document.querySelector('video');
videoElement.disablePictureInPicture = true;
7 Replies
Try:
const videoPip = document.querySelector('.video-pip');
videoPip.style.display = 'none'
Run with Execute JS when the timeline starts on this slide
Hello, Ramic! Sorry for the delay. The disablePictureInPicture seems to work best, but it does not override browser settings. We are still researching! I'll post back here if we find a solution. Given there is no Articulate Hero response, I'm assuming this is not possible...yet.
in Firefox there is only a reduced "disablePictureInPicture" available, because it' a user setting
in Firefox JavaScript can only disable the overlay PiP button - the PiP function and the other options to start PiP cannot be disabled
Yeah, it's a browser feature that isn't accessible to web properties. Firefox has implemented this feature autonomously, apart from the W3C working draft specification. Since the draft isn't a standard, Firefox opted not to adhere to it, whereas Chrome did. The script I shared earlier works across different browsers, at least in my experience. It simply hides the PiP icon in the Storyline video. Interestingly, I've noticed that the Storyline video PiP icon is no longer visible in Firefox. Is it just me?
in Firefox PiP icon is not actív for short videos
about:config => media.videocontrols.picture-in-picture.video-toggle.min-video-secs
default is 45 sec
Checked. Thanks Jürgen.
I have noticed that I can hide the icon, but only temporarily; it can be overridden in FireFox. I know that MS did not have this option for quite a while. Don't know why they started up again with 508 such a huge deal these days. At least give us the option to disable it with code.