आईओएस सफारी में overflow: scroll
div का उपयोग करने का प्रयास करते समय मैं कई बार इस मुद्दे पर आया हूं।
मेरी समझ यह है कि यह overscrolling/लोचदार स्क्रॉलिंग एनिमेशन के साथ करना है। क्या लगता है तो होना ही है:
- जब एक निश्चित कंटेनर (अर्थात खिड़की, या अपने स्क्रॉल div) इन ऐनिमेशन घटनाओं कि कंटेनर के लिए लॉक हो जाता है चल रहा है।
- जब
overflow: scroll
कंटेनर इसकी स्क्रॉल ऊंचाई के ऊपर/नीचे हिट करता है तो यह मूल कंटेनर स्क्रॉल करना शुरू करता है - यह क्रोम में भी मामला है।
आप अपने उदाहरण में नोटिस कर सकते हैं कि जब स्क्रॉलिंग काम करना बंद कर देती है, तो थोड़ी सी अवधि के लिए स्क्रीन को छूना नहीं (500ms कहें?) फिर फिर से काम करने की कोशिश कर रहा है।
मुझे लगता है कि क्या हो रहा है यह है कि जब आप अपने स्क्रॉलिंग कंटेनर के नीचे/ऊपर हिट करते हैं, तो घटनाएं इस मामले में विंडो में पैरेंट हो रही हैं। जबकि आप इस स्थिति में बातचीत करते रहते हैं, आपकी घटनाएं इसे आपके स्क्रॉलिंग कंटेनर में कभी नहीं बनाती हैं, और इसलिए यह अनुत्तरदायी प्रतीत होता है।
मैं दस्तावेज़ करने के लिए मेरी स्क्रॉल कंटेनर से स्पर्श इवेंट प्रचार नहीं द्वारा अतीत में कुछ सफलता मिली है:
$('.chat-container-mobile').on({
'touchstart': _onTouchStart,
'touchmove': _onTouchMove,
'touchend': _onTouchEnd
});
function _onTouchStart(e) {
e.stopPropagation();
}
function _onTouchMove(e) {
e.stopPropagation();
}
function _onTouchEnd(e) {
e.stopPropagation();
}
नोट: यह नहीं के रूप में, कई स्थितियों में एक फिक्स हो जाएगा आपको अक्सर डिफ़ॉल्ट विंडो व्यवहार को बनाए रखने की आवश्यकता होती है। हालांकि इस मामले में, आपके पास एक निश्चित लेआउट प्रतीत होता है जिसके लिए डिफ़ॉल्ट दस्तावेज़ स्क्रॉलिंग व्यवहार की आवश्यकता नहीं होती है। इसके अतिरिक्त, यदि आप शीर्ष 'समूह चैट' बार या नीचे 'टाइप संदेश' बार को स्पर्श करके स्क्रॉल करने का प्रयास करते हैं, तो फिर भी आप एक ही परिणाम देखेंगे, फिर तुरंत अपने कंटेनर में स्क्रॉल करने का प्रयास करें।
आप इन स्पर्श घटनाओं के लिए $(document)
पर e.preventDefault
का उपयोग करने का भी प्रयास कर सकते हैं। यह विंडो को पहले उपयोगकर्ता में इन उपयोगकर्ता इनपुट पर प्रतिक्रिया करने से रोकता है, फिर भी यदि आपको ब्राउज़र डिफ़ॉल्ट बनाए रखने की आवश्यकता है तो यह कई अन्य समस्याएं पैदा कर सकता है।
इन बाइंडिंग को केवल उन स्थितियों में स्थानांतरित करने का प्रयास करें जहां यह एक समस्या है। तो घटनाओं पर बाध्य करने से पहले आईओएस और सफारी की जांच करें।
अगली बार जब मैं समस्या से निपटने का प्रयास करता हूं तो मैं किसी भी अतिरिक्त निष्कर्षों के साथ वापस आऊंगा - जो, ईमानदार रहें, लगभग हर परियोजना है।
शुभकामनाएं!
को मैं सिर्फ यह परीक्षण किया जोड़ने के लिए एक पर कोशिश करते हैं और यह पुन: पेश नहीं कर सका। आप किस पर परीक्षण कर रहे हैं? –