How to disable Picture in Picture mode on HTML5 video

If you want to do it through JavaScript. This code applies for all videos on your page and it disables the download,take picture and right click context which also contains download option.

You may want to change jQuery to $ I wrote this code add it to my theme in WordPress to disable the download in all videos in my site.

jQuery('video').on("loadeddata", function() {
    jQuery('video').attr('controlsList', 'nodownload');
    jQuery('video').bind('contextmenu',function() { return false; });
    jQuery('video').attr('disablePictureInPicture', 'true');
}); 

per the spec at https://wicg.github.io/picture-in-picture/#disable-pip, the attribute to control this is disablePictureInPicture

<video controls disablePictureInPicture controlsList="nodownload">
  <source src="https://www.w3schools.com/html/mov_bbb.ogg" type="video/mp4">
  <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/ogg">
</video>

to achieve the same through javascript:

<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>

Use this:

<video controls disablePictureInPicture>

The disablePictureInPicture is a boolean flag that would disable picture in picture item in three dots menu.