मोबाइल उपकरणों पर स्क्रॉल अक्षम करें

Question

मेरे पास एक साधारण HTML पृष्ठ है जहां जब मैं एक div को स्पर्श करता हूं तो हम स्क्रॉल नहीं कर सकते हैं। आप यह पृष्ठ here

यदि आप इस पृष्ठ को डेस्कटॉप ब्राउज़र के साथ खोलते हैं, जैसे फ़ायरफ़ॉक्स, यदि आप div पर क्लिक करते हैं तो आप स्क्रॉल नहीं कर सकते हैं।

अब मैं एंड्रॉइड की तरह मोबाइल पर यह व्यवहार चाहता हूं। वास्तव में एंड्रॉइड पर यदि आप इस पेज को खोलते हैं तो आप किसी भी मामले में स्क्रॉल कर सकते हैं।

मेरे उदाहरण में रंग के लिए खेद है;)

Answer 1

मुझे लगता है कि आप मोबाइल उपकरणों पर स्क्रॉल निष्क्रिय करने के लिए कैसे पूछ रहे हैं:

आप touchstart और touchmove के लिए एक घटना श्रोता जोड़ सकते हैं। फिर जब ये ईवेंट ट्रिगर किए जाते हैं तो यह पता लगाने के लिए कि ब्राउज़र एक स्पर्श डिवाइस है या नहीं, Modernizr का उपयोग करें। जाहिर है कि सभी मोबाइल स्पर्श डिवाइस नहीं हैं और ऐसे स्पर्श डिवाइस हैं जिनमें उच्च रिज़ॉल्यूशन है, इसलिए अगर कथन को जोड़ने या मुक्त करने में संकोच न करें।

document.addEventListener('touchstart', this.touchstart); 
document.addEventListener('touchmove', this.touchmove); 

function touchstart(e) { 
    e.preventDefault() 
} 

function touchmove(e) { 
    e.preventDefault() 
} 

या, बस Modernizr का उपयोग और फिर सीएसएस का उपयोग करें:

html.touch body { 
    overflow:hidden; 
} 

और फिर मीडिया क्वेरी जोड़ें प्रभावी रूप से अपने या बयान है।