डेस्कटॉप पर विश्वसनीय रूप से प्रदर्शित करने के लिए डेस्कटॉप पेज नहीं मिल सकता

Question

मैं एक पृष्ठ पर काम कर रहा हूं here कि मैं मोबाइल फोन पर सैनिली रूप से प्रदर्शित नहीं कर सकता। मैं इसे सैमसंग एस 7 के साथ पढ़ रहा हूं। पेज डेस्कटॉप (चौड़ाई तीर और आयाम के बिना) पर इस तरह दिखता है:

और है कि मैं S7 पर देखना चाहेंगे क्या करना है: मूल का एक सरल छोटा संस्करण। चौड़ाई 1200 पीएक्स है। मेरे पास पृष्ठ पर नीचे मेटा व्यूपोर्ट टैग है:

<meta name="viewport" content="width=1200, initial-scale=3"> 

कभी-कभी यह व्यूपोर्ट टैग काम करता है, जो मुझे वही देता है जो मुझे चाहिए। लेकिन अगर मैं इसे फिर से लोड करता हूं, तो पृष्ठ बाईं ओर ऑफ़सेट लोड हो सकता है ताकि मेनू स्क्रीन बंद हो। या यह आवर्धन लोड हो जाएगा। एक बार गलत तरीके से लोड होने के बाद, मैंने टैपिंग और स्वाइपिंग रखी और अचानक यह ऊपर सही लेआउट पर फंस गया।

मैंने व्यूपोर्ट टैग के साथ प्रयोग किया है। शुरुआती-पैमाने का मान प्रभावित नहीं होता है, मैंने 1 और 3 की कोशिश की है, यह दोनों के साथ काम करता है और दोनों के साथ विफल रहा है। चौड़ाई 1200 होना प्रतीत होता है या यह हर बार विफल हो जाएगा।

क्या कोई सुझाव दे सकता है कि यह इतना गलत तरीके से क्यों व्यवहार कर रहा है?

धन्यवाद

Answer 1

मूल का एक सरल छोटा संस्करण।

के लिए, आप

<meta name="viewport" content="width=1200, initial-scale=3"> 

उपयोग

<meta name="viewport" content="width=device-width, initial-scale=1.0"> 

उपयोग नहीं करना चाहिए, क्योंकि यदि आप width=1200px निर्धारित करते हैं, आप मोबाइल डिवाइस में यह स्क्रॉल करना पड़ सकता।

लेकिन width=device-width में, यह स्वचालित रूप से डिवाइस की उपलब्ध चौड़ाई लाता है और तदनुसार फैलाता है।

आप MDN

को यहां आधिकारिक दस्तावेज पढ़ सकते हैं कुछ अन्य ज़ूम इन करने के बारे में गुण हैं।

वे minimum-scale, maximum-scale, user-scalable हैं।

minimum-scale -> न्यूनतम ज़ूम स्तर <int> मूल्य

maximum-scale -> अधिकतम ज़ूम स्तर <int> मूल्य

user-scalable -> चाहे उपयोगकर्ता ज़ूम या नहीं करने के लिए अनुमति देते हैं। yes या no