क्या आप एंड्रॉइड ब्राउज़र में एक div scrollable की ओवरफ्लो सामग्री बना सकते हैं?एंड्रॉइड ब्राउज़र बग? div overflow scrolling
यह अन्य सभी आधुनिक ब्राउज़रों में स्क्रॉल करने योग्य है।
आईओएस में यह स्क्रॉल करने योग्य है - हालांकि यह स्क्रॉलबार नहीं दिखाता है - लेकिन यह ड्रैगिंग के माध्यम से स्क्रॉल करने योग्य है।
एक साधारण उदाहरण: http://jsfiddle.net/KPuW5/1/embedded/result/
इस जल्द ही तय किया जाएगा?
आप स्क्रॉल div तत्वों
overflow: scroll; के लिए touchscoll.js की कोशिश कर सकते एंड्रॉयड 3 (एपीआई 11) के रूप में समर्थित है।
एक क्रॉस-प्लेटफार्म (अर्थात् आईओएस < = 4.3.2) Cubiq iScroll एक आसान-कार्यान्वयन फिक्स है।
आप अपने सीएसएस में स्क्रॉलबार की शैलियों को परिभाषित करके एंड्रॉइड में एक डीआईवी स्क्रॉल करने योग्य बना सकते हैं। यह लेख आपको यह करने के लिए कैसे पता चलता है: http://css-tricks.com/custom-scrollbars-in-webkit/
क्या आप यहां एक छोटा सा नमूना शामिल कर सकते हैं, इस उत्तर को बेकार होने से रोकने के लिए यदि वह लिंक मर जाता है? –
यह वास्तव में एंड्रॉइड 2 पर स्क्रॉलबार दिखाता है।3, लेकिन div scrollable नहीं बनाता है :( – Husky
Husky, मैं इसे एंड्रॉइड 2.3 पर आज़माता हूं और यह काम करता है। शायद व्यवहार अलग-अलग उपकरणों में भिन्न होता है। इस वेबैप के साथ प्रयास करें: http://applications.frenys.com/webapp/ ? ref = dl और app = 116815031665454 (आपको स्क्रॉलबार ट्रैक के खाली भाग को स्पर्श/क्लिक करना होगा) – juamp
एंड्रॉयड 3.0 और उच्चतर overflow:scroll के लिए समर्थन, < 3.0 पर यह एक और कहानी है। आपको आईएसक्रॉल जैसे पॉलीफिल के साथ कुछ सफलता हो सकती है, हालांकि यह लागत पर आता है। जटिल लेआउट वाले साइटों पर कार्यान्वित करना मुश्किल है, और आपको अपनी साइट पर सामग्री के हर बार एक विधि को कॉल करने की आवश्यकता है। मेमोरी उपयोग भी एक मुद्दा है: इन प्रकार के पॉलीफिलों के कारण पहले से ही कम बिजली वाले उपकरणों का प्रदर्शन अंतराल हो सकता है।
मैं एक अलग दृष्टिकोण की सिफारिश करता हूं: ओवरफ्लो स्क्रॉलिंग के लिए समर्थन का पता लगाने के लिए आधुनिकता का उपयोग करें, अपने html टैग में एक कक्षा जोड़ें और अपने सीएसएस को फिर से लिखने के लिए इसका उपयोग करें ताकि पृष्ठ बॉक्स में बजाय 'सामान्य' स्क्रॉल कर सकें।
/* For browsers that support overflow scrolling */
#div {
height: 400px;
overflow: auto;
}
/* And for browsers that don't */
html.no-overflowscrolling #div {
height: auto;
}
मुझे लगता है कि आपका अनुशंसित दृष्टिकोण गलत धारणा पर आधारित है। Modernizr का 'overflowscrolling' परीक्षण नहीं है क्या ब्राउज़र में 'ओवरफ़्लो: स्क्रॉल' काम करता है, लेकिन क्या ब्राउजर को '* -overflow-scrolling' css प्रॉपर्टी के लिए समर्थन है, जो अलग है। – speedarius
:
स्क्रॉलबार वास्तव में वहाँ Android 2.3 में हैं, लेकिन वे बहुत ही गाड़ी रहे हैं और डिफ़ॉल्ट रूप से वे 0 चौड़ाई स्टाइल हैं, इसलिए वे अदृश्य हैं।
आप उनकी तरह स्टाइल जोड़कर दृश्यमान बना सकते हैं:
::-webkit-scrollbar {
width: 30px;
}
::-webkit-scrollbar-track {
background-color: $lightestgrey;
}
::-webkit-scrollbar-thumb {
background-color: $lightgrey;
}
हालांकि, अंगूठे तत्व खींचने योग्य नहीं है, आप केवल नीचे या ऊपर ट्रैक दोहन से स्थानांतरित कर सकते हैं।
इसके अलावा, ये शैलियों सभी वेबकिट ब्राउज़र में आपके स्क्रॉलबार के रूप में बदल जाएंगी, इसलिए सबसे अच्छा आपको एक कक्षा जोड़नी चाहिए जो केवल एंड्रॉइड 2.3 पर लागू हो।
यह एक बग है: http://code.google.com/p/android/issues/detail?id=6864 कई कार्य-आसपास हैं: http://cubiq.org/iscroll-4 इसके बजाय इन हैक्स की तुलना में - बग को ठीक किया जाना चाहिए, एचटीएमएल के आसपास के सभी प्रचार के साथ मुझे आश्चर्य है कि यह कितना खराब है। – mercador
यह अब तय किया जा रहा है। कुछ एसडीके में नवीनतम वेबव्यू नहीं हैं और अभी भी यह समस्या हो सकती है हालांकि – neaumusic