मैं एक वेब ऐप बना रहा हूं जिस पर उत्पाद कार्ड पूर्णस्क्रीन तक फैलता है। लेकिन स्क्रॉलडाउन पर छुपा ब्राउज़र का शीर्ष बार इस आंतरिक स्क्रॉल करने योग्य div पर प्रतिक्रिया नहीं करता है और केवल मुख्य पृष्ठ पर प्रतिक्रिया करता है (जो कार्ड खोले जाने पर लॉक हो जाता है)। यहां तक कि मेनू बटन जो ईवेंट श्रोता को window
में जोड़ता है और जिसे स्क्रॉलडाउन पर छिपाना चाहिए, वह कार्ड में ऐसा नहीं करता है। इसके अलावा, जब मैंने कस्टम स्क्रॉलबार का उपयोग करने का निर्णय लिया और मुख्य पृष्ठ को एक कस्टम div में पैक किया - इसने किसी भी स्थिति में स्क्रॉल पर प्रतिक्रिया करना बंद कर दिया (f.e. शीर्ष बार केवल तभी छुपाता है जब मैं नीचे स्क्रॉल करता हूं)। इसका समाधान कैसे किया जा सकता है? हो सकता है कि इसके लिए सार्वभौमिक रूप से किसी भी स्क्रॉल पर प्रतिक्रिया करने का एक तरीका हो? आपका अग्रिम में ही बहुत धन्यवाद!
1 उत्तर
मेरी पिछली टिप्पणी से:
यदि शरीर स्क्रॉल किया जाता है तो ब्राउज़र केवल यूआरएल बार छुपाएगा। आपकी सबसे अच्छी शर्त यह होगी कि आप अपने ऐप को अपने स्क्रॉल कंटेनर के रूप में मूल तत्व का उपयोग करने के लिए पुन: व्यवस्थित करें। और कुछ भी एक हैक और अविश्वसनीय होगा। यदि आवश्यक हो, तो पृष्ठ को थोड़ा सा स्थानांतरित करने और URL बार को छिपाने के लिए थोड़ी देर के बाद
window.scrollTo
का उपयोग करके इसके आसपास कुछ तरीके हैं। मुद्दा यह है कि यह उपयोगकर्ता के ओएस के डिफ़ॉल्ट व्यवहार को तोड़ देगा और संभवतः उन्हें भ्रमित कर देगा।
@ जॉन की टिप्पणी:
@JustinTaddei वाह, धन्यवाद, वास्तव में बहुत महत्वपूर्ण जानकारी! आपको इसे उत्तर के रूप में पोस्ट करना चाहिए था। जबकि जिस div में मेरा सभी ऐप देता है वह 100vw है, मुझे लगता है कि मैं स्क्रॉल पर बॉडी स्क्रॉल इवेंट को कॉल करने का प्रयास करूंगा, शायद यह काम करेगा (शरीर को कहीं भी नहीं जाना है)। लेकिन मैं मानता हूं, यह थोड़ा हैकी है। अन्यथा, जैसा आपने कहा था, मैं ऐप को पुन: स्थापित करने का प्रयास करूंगा। लेकिन मुझे नहीं पता कि स्क्रॉल कंटेनर के रूप में रूट का उपयोग करके मेरे कार्ड के विचार को कैसे महसूस किया जाए। क्या यह संभव भी है?
मुझे window.scrollTo
का उपयोग करने के बारे में जो कहा गया है उसे वापस लेना चाहिए क्योंकि मैंने अभी इसका परीक्षण किया है और यह अब काम नहीं कर रहा है (जो हैक से अपेक्षित है)। मुझे कोई कारण नहीं दिख रहा है कि आप मूल तत्व का उपयोग करके समान कार्ड लेआउट को लागू क्यों नहीं कर सके।
जहां तक स्क्रॉलबार का सवाल है, तो आप डिफ़ॉल्ट लोगों को बदलने के बजाय उन्हें स्टाइल करना बेहतर समझते हैं। यहां css-tricks.com से इसके बारे में एक ट्यूटोरियल है
window.scrollTo
का उपयोग करके इसके आसपास कुछ तरीके हैं। मुद्दा यह है कि यह उपयोगकर्ता के ओएस के डिफ़ॉल्ट व्यवहार को तोड़ देगा और संभवतः उन्हें भ्रमित कर देगा।window.scrollTo
का उपयोग करने के बारे में जो कहा गया था उसे वापस लेना चाहिए क्योंकि मैंने अभी इसका परीक्षण किया है और यह अब काम नहीं करता है (जो हैक से अपेक्षित है)। मुझे कोई कारण नहीं दिख रहा है कि आप रूट का उपयोग करके समान कार्ड लेआउट को लागू क्यों नहीं कर सके। यदि आप अपने एचटीएमएल के प्रासंगिक हिस्सों को शामिल करने के लिए अपना उत्तर अपडेट करते हैं (केवल सामान्य संरचना बहुत मदद करेगी) तो मैं इसे समझने में आपकी सहायता कर सकता हूं। जहां तक आपकी स्क्रॉलबार की बात है, तो आप डिफ़ॉल्ट पट्टियों को बदलने के बजाय उन्हें स्टाइल करना बेहतर समझेंगे। यहां css-tricks.com से इसके बारे में एक ट्यूटोरियल है