पूर्णस्क्रीन मोड में एक वेबसाइट चलाएं

Question

मैं अपनी वेबसाइट को इंटरेक्शन के बिना पूर्णस्क्रीन मोड में रखने के लिए एक चाल की तलाश में हूं।

मैं कुछ एचटीएमएल 5 के तकनीकों का उपयोग कर उदाहरण मिल गया है, लेकिन फिर सब एक मानव बातचीत से शुरू हो रहा की जरूरत है।

इस वेबसाइट के एक टीवी में प्रदर्शित किया जाएगा ...

मैं पहले से ही पूर्ण स्क्रीन मोड में एक SWF फ़ाइल का उपयोग कर लोड में लगता है कि वेबसाइट, लेकिन इसके बजाय इस दिशा में जाने का, मैं का उपयोग कर सभी संभावनाओं पर जोर देना चाहते हैं बस डिफ़ॉल्ट पैटर्न (एचटीएमएल, सीएसएस और जावास्क्रिप्ट)

Answer 1

आप बल पूर्णस्क्रीन मोड में प्रदर्शित करने के लिए वेबसाइट नहीं कर सकते हैं।

यदि संभव हो तो सुरक्षा चिंताओं की कल्पना करें।
दुर्भावनापूर्ण वेबसाइटें सभी प्रकार के संदिग्ध व्यवसायों के लिए एक कम कंप्यूटर साक्षर व्यक्ति के डेस्कटॉप को "हाइजैक" कर सकती हैं। आप बस अपने कोड से यह कॉल करने के लिए प्रयास करते हैं तो
"Failed to execute 'requestFullScreen' on 'Element': API can only be initiated by a user gesture." :

जे एस पूर्ण स्क्रीन API के सब के सब इस तरह एक त्रुटि फेंक देते हैं।

मैं बहुत रफ़ू यकीन है कि फ्लैश, इसी तरह की है कि यह उपयोगकर्ता बातचीत की आवश्यकता है फुलस्क्रीन जाना हूँ। अन्यथा, हमने पूर्णस्क्रीन पॉपअप के हमारे उचित हिस्से को देखा होगा जो करीब बंद करना लगभग असंभव है।

Answer 2

आप https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Using_full_screen_mode पर वर्णन किए गए requestFullScreen() तरीकों का उपयोग करने में सक्षम हो सकता है।

नोट: यह अभी भी उपयोगकर्ता इनपुट की आवश्यकता है - लेकिन फ्लैश के उपयोग से बचें।

function toggleFullScreen() { 
    if (!document.fullscreenElement && // alternative standard method 
     !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) { // current working methods 
    if (document.documentElement.requestFullscreen) { 
     document.documentElement.requestFullscreen(); 
    } else if (document.documentElement.msRequestFullscreen) { 
     document.documentElement.msRequestFullscreen(); 
    } else if (document.documentElement.mozRequestFullScreen) { 
     document.documentElement.mozRequestFullScreen(); 
    } else if (document.documentElement.webkitRequestFullscreen) { 
     document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT); 
    } 
    } else { 
    if (document.exitFullscreen) { 
     document.exitFullscreen(); 
    } else if (document.msExitFullscreen) { 
     document.msExitFullscreen(); 
    } else if (document.mozCancelFullScreen) { 
     document.mozCancelFullScreen(); 
    } else if (document.webkitExitFullscreen) { 
     document.webkitExitFullscreen(); 
    } 
    } 
} 

toggleFullScreen(); 

यह पृष्ठ को पूर्ण स्क्रीन को सक्रिय करने की अनुमति देता है, और संभवतः जावास्क्रिप्ट पृष्ठ पर पृष्ठ लोड के माध्यम से सक्रिय किया जा सकता है। हालांकि, पुराने ब्राउज़र के लिए कोई समर्थन नहीं है।

Answer 3

जब मैं इसी तरह कुछ करने के लिए की जरूरत है मैं एक स्प्लैश स्क्रीन का इस्तेमाल किया। पूर्ण स्क्रीन मोड में जारी रखने के लिए बटन एक जे एस पॉप की एक विशेषता के रूप में यह अनुरोध किया:

onClick="window.open('pageName.html', 'test', 'fullscreen=yes')" 

यह fullproof नहीं है, लेकिन किसी भी अन्य तरीकों मैंने पाया की तुलना में बेहतर काम किया। आप संभवतः उपयोगकर्ता इंटरैक्शन के बिना ऐसा करने में सक्षम नहीं होंगे, इसलिए स्प्लैशस्क्रीन जैसी किसी चीज का उपयोग करने से आप घुसपैठ को कम से कम कुछ और स्वीकार कर सकते हैं।

Answer 4

अन्य उत्तर पहले से ही वर्णन कैसे आप एक कम या ज्यादा ब्राउज़र-स्वतंत्र ढंग से पूर्ण स्क्रीन जा सकते हैं। हालांकि, उपयोगकर्ता इंटरैक्शन की आवश्यकता की समस्या बनी हुई है।

---

सुरक्षा कारणों से आप अपने वेबपृष्ठ को पूर्णस्क्रीन मोड में प्रदर्शित करने के लिए मजबूर नहीं कर सकते हैं। इसके लिए उपयोगकर्ता इंटरैक्शन की आवश्यकता है।

साथ ही, जब भी उपयोगकर्ता किसी अन्य पृष्ठ पर जाता है, तब भी ब्राउज़र पूर्णस्क्रीन मोड छोड़ देता है, यहां तक ​​कि एक ही वेबसाइट पर, और उसे प्रत्येक पृष्ठ पर पूर्णस्क्रीन मोड में वापस जाने के लिए कुछ "उपयोगकर्ता इंटरैक्शन" करना होगा।
यही कारण है कि यदि आप पूर्णस्क्रीन होना चाहते हैं तो आपकी वेबसाइट को एक ही पृष्ठ होना चाहिए।

---

है यही तो मैं सुझाव है: एक भी छप पेज पर एक छिपा iFrame का उपयोग करें।

जब भी उपयोगकर्ता कहीं भी क्लिक करता है या किसी भी कुंजी दबाता है, तो बस इस आईफ्रेम को पूर्णस्क्रीन के रूप में सेट करें और इसे दिखाएं। जब आप पूर्णस्क्रीन मोड छोड़ने पर कोई ईवेंट प्राप्त करते हैं, तो स्प्लैश दिखाने के लिए फिर से IFrame को छुपाएं।

डिफ़ॉल्ट रूप से उसी फ्रेम में लिंक खुलते हैं, इसलिए आप पूर्णस्क्रीन मोड में तब तक रहेंगे जब तक उपयोगकर्ता स्पष्ट रूप से इसे छोड़ देता है या कुछ लिंक नए टैब में खुलते हैं।

यहाँ एक उदाहरण है कि क्रोम में काम करता है: (। See it in action. उपयोग अन्य उत्तर यह ब्राउजर स्वतंत्र बनाने के लिए)

<html> 
<head> 
    <script language="jscript"> 
     function goFullscreen() { 
      // Must be called as a result of user interaction to work 
      mf = document.getElementById("main_frame"); 
      mf.webkitRequestFullscreen(); 
      mf.style.display=""; 
     } 
     function fullscreenChanged() { 
      if (document.webkitFullscreenElement == null) { 
       mf = document.getElementById("main_frame"); 
       mf.style.display="none"; 
      } 
     } 
     document.onwebkitfullscreenchange = fullscreenChanged; 
     document.documentElement.onclick = goFullscreen; 
     document.onkeydown = goFullscreen; 
    </script> 
</head> 
<body style="margin:0"> 
    <H1>Click anywhere or press any key to browse <u>w3schools</u> in fullscreen.</H1> 
    <iframe id="main_frame" src="http://www.w3schools.com" style="width:100%;height:100%;border:none;display:none"></iframe> 
</body> 
</html> 

---

पी.एस. मुझे उपरोक्त @jsve द्वारा प्रदान किया गया लिंक पसंद है, और इस तरह यह भी बेहतर है: change your OS :)।
इसके अलावा, मैं एक वेब डेवलपर नहीं हूं। बस सोचा कि यह सवाल जांचना दिलचस्प होगा।

Answer 5

यह वही नहीं है जो ओपी की तलाश में था, लेकिन मेरी विशेष स्थिति में, मुझे कियोस्क मोड और काम करने के लिए कुछ गतिशील स्टाइल का संयोजन मिला।

मैं एक विशेष यूआरएल के साथ एक ब्राउज़र शुरू करना चाहता था और इसे पूर्ण स्क्रीन मोड में शुरू करना चाहता था। एक केस प्लांट के साथ एक विनिर्माण संयंत्र में टर्मिनल पर कोई उपयोगकर्ता इंटरैक्शन नहीं है। बिजली के बाद, इसे केवल बातचीत के बिना स्थिति प्रदर्शित करने की आवश्यकता होती है (यानी उपयोगकर्ता कॉन्फ़िगरेशन यूआई तत्वों को प्रदर्शित नहीं करता है जब तक कि उपयोगकर्ता इंटरैक्ट नहीं करता)।

शायद, एक जटिल साइट पर यथार्थवादी नहीं है, लेकिन मेरा उपयोग एक विशेष "फलक" (इस मामले में div) तत्व था। विशेष div पर ध्यान केंद्रित करने के लिए, मैंने अन्य divs छुपाया, और तदनुसार शैली सेट करें। यदि से और पूर्णस्क्रीन में बदलने के लिए उपयोगकर्ता इंटरैक्शन होता है, तो मैं (1) नियमित myElement का उपयोग करता हूं। * RequestFullScreen() दस्तावेज़। * ExitFullscreen() कॉल, (2) अन्य divs को दिखाएं/छुपाएं, और (3) स्विच नीचे वर्गों के बीच:

.right-pane-fullscreen 
{ 
    margin-left: 0px; 
} 

.right-pane-normal 
{ 
    margin-left: 225px; 
} 

कैसे क्रोम में कियोस्क मोड का उपयोग करने पर संबंधित चर्चा Opening Chrome browser in full window or kiosk mode on windows 7