I recently encountered an issue with my Chrome extension where a menu I inserted into the page would disappear whenever a flash or html5 video player went full screen. Is it possible to have two objects in full screen simultaneously, or is there another solution that can work universally across all video players without having to customize the HTML code for different websites?
UPDATE:
With the transition from Flash to HTML5 on most websites, achieving this functionality has become more feasible than before.
Below is the snippet of code that I developed and implemented to address this problem:
document.addEventListener("webkitfullscreenchange", function(){
var fse = document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement;
if(fse){
fse.appendChild(menu);
} else {
if (window.self !== window.top) {
menu.remove();
} else {
document.body.insertBefore(menu, document.body.firstChild);
}
}
});