मोबाइल क्रोम

Question

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

बेशक, मैंने event.preventDefault() की कोशिश की; और स्पर्श-क्रिया: कोई नहीं; लेकिन यह काम नहीं देखता है। क्या मुझे ईवेंट टैग और बॉडी टैग पर टच-एक्शन जोड़ना चाहिए? मैं उदाहरण के साथ उपयोगी जवाब की उम्मीद है।

Answer 1

आपको निम्न Google लेख देखना चाहिए। यह जवाब देता है और एक कामकाजी डेमो प्रदान करता है।

https://docs.google.com/document/d/12Ay4s3NWake8Qd6xQeGiYimGJ_gCe0UMDZKwP9Ni4m8/mobilebasic

Answer 2

के बाद से मोबाइल क्रोम> = 56 घटना श्रोताओं डिफ़ॉल्ट और निष्क्रिय घटना श्रोताओं चूक अब और नहीं रोका जा सकता द्वारा निष्क्रिय कर रहे हैं। See here

इसके बजाय आप तो जैसे सक्रिय घटना श्रोताओं उपयोग करने की आवश्यकता:

document.addEventListener('touchstart', touchstartHandler, {passive: false}); 
document.addEventListener('touchmove', touchmoveHandler, {passive: false}); 

यहाँ एक काम कर उदाहरण:

https://output.jsbin.com/niyukadizu/quiet

https://output.jsbin.com/niyukadizu

Answer 3

इस प्रयास करें।

body { 
    /* Disables pull-to-refresh but allows overscroll glow effects. */ 
    overscroll-behavior-y: contain; 
} 

यह मेरे लिए अच्छा काम करता है। अन्य जावास्क्रिप्ट हैक्स के कारण मेरे पास अजीब स्क्रॉलिंग समस्याएं थीं। अधिक जानकारी के लिए इस लेख को पढ़ें।

https://developers.google.com/web/updates/2017/11/overscroll-behavior