सीएसएस अतिप्रवाह स्क्रॉल और छिपे हुए स्क्रॉलबार (आईओएस)

Question

मेरे ऐप में मैं

-webkit-overflow-scrolling: touch; 

क्योंकि iOS पर पुस्तक का मानना ​​है "हार्ड" का उपयोग करने की जरूरत है। लेकिन मुझे स्क्रॉलबार को छिपाने की जरूरत है।

मैं कुछ इस तरह है:

.container { 
    -webkit-overflow-scrolling: touch; 
} 

.container::-webkit-scrollbar { 
    display: none; 
    height: 0; 
    width: 0; 
} 

अब स्क्रॉल बहुत तरल पदार्थ का मानना ​​है लेकिन मैं अभी भी स्क्रॉल पट्टी देख सकते हैं ...

Answer 1

मैं सिर्फ इस codepen के साथ एक खेल था (https://codepen.io/devstreak/pen/dMYgeO) और ऐसा लगता है कि यदि आप नीचे दिए गए सभी तीन गुणों के लिए background-colortransparent पर सेट करते हैं, तो स्क्रॉल (और इस उदाहरण में box-shadow एस भी हटाएं), स्क्रॉलबार बिल्कुल दिखाई नहीं देता है:

#style-1::-webkit-scrollbar-track 
{ 
// -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.1); 
    background-color: transparent; 
} 

#style-1::-webkit-scrollbar 
{ 
    background-color: transparent; 
} 

#style-1::-webkit-scrollbar-thumb 
{ 
// -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); 
    background-color: transparent; 
} 

यह आईफोन 6+ पर क्रोम डेस्कटॉप, एंड्रॉइड के लिए क्रोम और आईओएस सफारी (v8.4) में परीक्षण किया गया था।

हालांकि स्क्रॉलबार को दृश्यमान रखने के लिए मैं उपयोगकर्ता अनुभव (प्रयोज्यता/अभिगम्यता) के लिए अनुशंसा करता हूं, भले ही मैं जानता हूं कि मैं क्या कर रहा था, कोई स्क्रॉलबार नहीं होने पर थोड़ा उलझन में आया।