फ़ायरफ़ॉक्स पूर्ण स्क्रीन वीडियो संलग्न डोम तत्वों

Question

कोई फर्क नहीं पड़ता कि कैसे मैं HTML5 वीडियो (स्थिर या गतिशील), Firefox में उन तत्वों को नहीं दिखाई दे रहा है, हालांकि z- सूचकांक 2147483647 पर सेट किया जाता है, अस्पष्टता 1 और ओवरले के रूप में डोम में तत्वों डाल प्रदर्शन क्षेत्र।

Chrome में काम 2 समान उत्तर देखें, लेकिन एफएफ में नहीं:

Overlay on HTML5 Fullscreen Video

Displaying elements other than fullscreen element (HTML5 fullscreen API)

Answer 1

बजाय वीडियो फुलस्क्रीन बनाने का ओवरले तत्व को प्रदर्शित करने,, वीडियो तत्व पूर्ण स्क्रीन की मूल हैं।

यहाँ उदाहरण देखें - https://jsfiddle.net/tv1981/tm069z9c/1/

संरचना निम्नलिखित में, मैं 'कंटेनर' फुलस्क्रीन

<div id="container"> 
    <div class="btn-fs" id="btnFS"> 
    Fullscreen 
    </div> 
    <div class='logo'> 
    Logo Overlay 
    </div> 
    <video width="100%" height="100%" autoplay> 
    <source src="http://www.sample-videos.com/video/mp4/720/big_buck_bunny_720p_1mb.mp4" type="video/mp4"> Your browser does not support the video tag. 
    </video> 
    <div class='footer'> 
    This is Test Overlay for Video 
    </div> 
</div> 

जावास्क्रिप्ट

fs.addEventListener('click', goFullScreen); 

function goFullScreen() { 
    var fullscreenElement = document.fullscreenElement || document.mozFullScreenElement || 
    document.webkitFullscreenElement || document.msFullscreenElement; 
    if (fullscreenElement) { 
    exitFullscreen(); 
    } else { 
    launchIntoFullscreen(document.getElementById('container')); 
    } 
} 

यह Chrome संस्करण 60.0.3112.101 में काम कर रहा है बनाने हूँ (सरकारी बिल्ड) (64-बिट), फ़ायर्फ़ॉक्स डेवलपर संस्करण 56.0b5 (64-बिट)