Открытие полноэкранного режима в javascript?

Question

это моя попытка автоматически открыть видео в полноэкранном режиме. это не работает. Я получаю сообщение об ошибке в веб-консоли:

Request for fullscreen was denied because Element.requestFullscreen() was not called from inside a short running user-generated event handler.

<div id="mydiv">

<video src="video.mp4" controls width=500 id="vid">
</video>
<br>
<a href='javascript:setPlayback(0.5, "vid")'> x0.5 </a>
&nbsp; &nbsp; &nbsp;
<a href='javascript:setPlayback(0.75, "vid")'> x0.75 </a>
&nbsp; &nbsp; &nbsp;
<a href='javascript:setPlayback(1, "vid")'> x1 </a>
&nbsp; &nbsp; &nbsp;
<a href='javascript:setPlayback(1.5, "vid")'> x1.5 </a>
&nbsp; &nbsp; &nbsp;
<a href='javascript:setPlayback(2, "vid")'> x2 </a>
&nbsp; &nbsp; &nbsp;
<a href='javascript:setPlayback(2.5, "vid")'> x2.5 </a>

</div>

<br><br>


<script>
/* Get the element you want displayed in fullscreen mode (a video in this example): */
var elem = document.getElementById("mydiv");

/* When the openFullscreen() function is executed, open the video in fullscreen.
Note that we must include prefixes for different browsers, as they don't support the requestFullscreen method yet */
function openFullscreen() {
  if (elem.requestFullscreen) {
    elem.requestFullscreen();
  } else if (elem.mozRequestFullScreen) { /* Firefox */
    elem.mozRequestFullScreen();
  } else if (elem.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
    elem.webkitRequestFullscreen();
  } else if (elem.msRequestFullscreen) { /* IE/Edge */
    elem.msRequestFullscreen();
  }
}

openFullscreen();
</script>

есть идеи, почему?