सीएसएस या जेएस

Question

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

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

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

Answer 1

पहले के लिए उपयोग कर सकते हैं

<script type="text/javascript"> 
$(document).ready(function() { 
    document.ontouchmove = function(e){ 
      e.preventDefault(); 
      } 
}); 

तो यह

input.onfocus = function() { 
    window.scrollTo(0, 0); 
    document.body.scrollTop = 0; 
} 

Answer 2

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

एचटीएमएल

<input autofocus> 

जे एस है है

for (var i = 0; i < 5; i++) { 
document.write("<br><button onclick='alert(this.innerHTML)'>" + i + "</button>"); 
} 

//document.querySelector('input').focus(); 

सीएसएस

button { 
width: 300px; 
height: 40px; 
} 

भी आप एक उपयोगकर्ता-एजेंट तरीके का उपयोग करना होगा, आप सभी आईओएस संस्करणों

if (!/iPad|iPhone|iPod/g.test(navigator.userAgent)) { 
element.focus(); 
}