यदि आप सबसे आम HTML व्यूपोर्ट मेटा सेटिंग्स का उपयोग करते हैं, तो किसी इनपुट एलिमेंट पर क्लिक करने से iOS डिवाइस पर ऑटो ज़ूम स्वचालित रूप से ट्रिगर होगा। कम से कम स्मार्टफोन्स पर। मैंने इसे iPhone 4, 5 और 6 पर टेस्ट किया है, सफारी और क्रोम ब्राउज़र का उपयोग करके। मेरे शोध के आधार पर यह सभी iOS डिवाइस के लिए समान है।
यह HTML कोड है जो ऑटो ज़ूम प्रभाव को होने देता है:
<meta name="viewport" content="width=device-width, initial-scale=1.0" />लेकिन यह ऑटो ज़ूम प्रभाव हमेशा वांछनीय नहीं होता। कभी-कभी यह आपके वेब ऐप की उपयोगिता को नुकसान पहुंचाएगा। यह पूरी तरह से संदर्भ पर निर्भर करता है।
सफारी और क्रोम दोनों पर इस प्रभाव को अक्षम करने के लिए, आप निम्नलिखित का उपयोग कर सकते हैं:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />एकमात्र नया कोड यह है कि हमने मेटा content एट्रिब्यूट में maximum-scale=1 मान जोड़ा।
महत्वपूर्ण
यह मैन्युअल रूप से ज़ूम इन और आउट करने के विकल्प को अक्षम नहीं करता, सफारी में। यह केवल ऑटो ज़ूम फ़ंक्शन को अक्षम करता है।
लेकिन क्रोम के मोबाइल ब्राउज़र में (iOS डिवाइस पर), यह मैन्युअल ज़ूम विकल्प को भी अक्षम करता है। यह आपकी उपयोग के मामले के आधार पर एक समस्या हो सकती है।
मुझे अभी तक कोई प्योर HTML समाधान नहीं मिला जो आपको क्रोम में मैन्युअल ज़ूम बनाए रखने की अनुमति दे। अगर मुझे मिलता है तो मैं इस लेख को अपडेट करूँगा।
एक बहुत सरल समाधान
यदि आप अपने इनपुट एलिमेंट्स को डिफ़ॉल्ट 11px के विपरीत न्यूनतम 16px फ़ॉन्ट साइज देते हैं, तो यह सफारी और क्रोम दोनों पर ऑटो ज़ूम प्रभाव को हटा देगा। कम से कम मेरे टेस्ट्स में ऐसा हुआ।
इस विधि से, आप अपने कंटेंट एट्रिब्यूट में maximum-scale-1 मान जोड़ने से बच सकते हैं और इस प्रकार क्रोम में मैन्युअल ज़ूम को प्रतिबंधित करने से बच सकते हैं।
रुको, आपने इस समाधान का सुझाव पहले क्यों नहीं दिया?
खैर, हो सकता है आप अपने मोबाइल पर सभी इनपुट फ़ील्ड्स पर 16px फ़ॉन्ट साइज न चाहें। यह आपको अपने मोबाइल UI की टाइपोग्राफी को अपने इनपुट फ़ील्ड्स को समायोजित करने के लिए अनुकूलित करने के लिए मजबूर करेगा।
और लगभग किसी भी चीज़ की तरह, इस मुद्दे को प्रोग्रामेटिक रूप से JavaScript का उपयोग करके हल किया जा सकता है, लेकिन यह इस लेख के दायरे से बाहर है।
साथ ही, ध्यान रखें कि आम तौर पर अपने यूजर्स को ज़ूम करने से प्रतिबंधित करना सलाह नहीं दी जाती है। अधिक जानकारी W3Schools पर। लेकिन फिर से, यह संदर्भ पर निर्भर करता है।
काश कोई सरल सेटिंग होती जो एक बार में सभी डिवाइसेज पर इस मुद्दे को हल कर सकती। अगर आपके पास इस विषय पर कोई अंतर्दृष्टि है, तो बेझिझक नीचे कमेंट सेक्शन में मुझे बताएं :-)
