How to block the double click on a video?

Question

I created a page with a video set in the resolution and layout I want, but when receiving a double click it enters mode fullscreen, I’d like to disable that. I used the script:

<script>
$(document).ready(function(){
$("*").dblclick(function(e){
e.preventDefault();
});
});
</script>

But even so the browser (Chrome) accepts double click and puts the video in fullscreen.

Answer 1

I suggest using a JS API for this, because this event is still having problems in some browsers... A simple and good api for video is the video js. in it you can lock the fullscreen perfectly, see the example:

HTML:

  <video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" width="340" height="268">
    <source src="http://vjs.zencdn.net/v/oceans.mp4" type='video/mp4'>
    <source src="http://vjs.zencdn.net/v/oceans.webm" type='video/webm'>
  </video>

JS:

videojs('my_video_1', {
  controlBar: {
    fullscreenControl: false
  }
});

Example

Answer 2

Try:

$("body").on('dblclick', function(){
   return false;
});

If it is a iframe can use:

<iframe allowfullscreen="0" src="https://www.youtube.com/embed/@(item.VideoUrl)"></iframe>