Как сделать DIV видимым поверх полноэкранного видео HTML5?

Моя конечная цель сейчас - сделать так, чтобы ссылка появлялась в верхней части видео, когда видео подошло к концу. Используя функциональность JW Players, я определил, как сделать ссылку доступной после завершения видео, но только в стандартном виде. Если пользователь просматривает видео в полноэкранном режиме, ссылка не отображается. Я много читал и понимаю, что, когда он находится в полноэкранном режиме, видео находится во флэш-памяти, и я не могу переопределить функции флэш-памяти, не интегрировав ссылку в файл SWF, чего я не хочу делать.

Что я сделал, так это удалил полноэкранную кнопку в видеоплеере JW Player с помощью скина. Затем я создал кнопку для отображения видео в полноэкранном режиме, используя полноэкранный режим HTML5. (Я понимаю, что IE не будет работать с этим ... это нормально сейчас). Я также могу создать полноэкранный прослушиватель событий изменения состояния, чтобы моя ссылка отображалась в верхней части видео. Но это не работает.

Независимо от того, как я оформляю DIV, который содержит ссылку, он не появляется в верхней части видео.

Может ли кто-нибудь указать мне правильное направление?

Спасибо за любую помощь, которую любой может мне дать.

Пример кода:

#container{
       position:relative;
   z-index:0;
}

#overlay {
   visibility:hidden; 
   width: 700px; 
   height:50px; 
   color:#FFF; 
   position: absolute; 
   top: 532px; 
   margin:8px; 
   padding:5px; 
   background-color:#000;   
   text-align:center;
}

#overlayfullscreen{
   visibility:hidden;
   text-align:center;
   color:#FFF;
   font-size:26px;
   z-index: 1000;
   position: absolute;          
   top: 800px;
   margin:8px; 
   padding:5px; 
   overlay:hidden;          
}



<div id="container">
    Loading the player, if not working please update your browser.
</div>                      

<button onClick="goFullscreen('container'); return false">Click for Fullscreen</button>





var path = '<?php echo $video_path ?>';

jwplayer("container").setup(
{
autostart: <?php echo $autostart ?>,        
file: "<?php echo $full_video_path ?>",                                 
height: <?php echo $height ?>,
width: <?php echo $width ?>,
skin: '<?php echo $skin ?>',

events: {
    onComplete: function(){
         document.getElementById('overlay').style.visibility = 'visible';                                       
      }                                 
    }                                   
});

document.addEventListener("mozfullscreenchange", function () 
{                                   
document.getElementById('overlayfullscreen').style.visibility = 'visible';              
}, false);

Ответы на вопрос(3)

Ваш ответ на вопрос