जावास्क्रिप्ट/आयनिक 3 ओवरफ़्लो: फ़ायरफ़ॉक्स में छुपा अक्षम स्क्रॉल

Question

मुझे समस्या है कि मैं फ़ायरफ़ॉक्स क्वांटम के स्क्रॉलबार को हटा नहीं सकता। ओह Chrome यह इस सीएसएस whith एक आकर्षण की तरह काम करता है:

div::-webkit-scrollbar { 
    border:none; 
    width:0; 
    background: rgba(0,0,0,0); 
    display: none; 
    overflow-x: hidden; 
    overflow-y: hidden; 
} 

div::-webkit-scrollbar-track { 
    border:none; 
    width:0; 
    background: rgba(0,0,0,0); 
    display: none; 
    overflow-x: hidden; 
    overflow-y: hidden; 
} 

div::-webkit-scrollbar-thumb { 
    border:none; 
    width:0; 
    background: rgba(0,0,0,0); 
    display: none; 
    overflow-x: hidden; 
    overflow-y: hidden; 
} 

इसके अलावा, मैं jQuery के साथ और कहा कि काम करता है के इस style="overflow: hidden;"

कुछ भी नहीं की तरह शरीर टैग करने के लिए इसे सीधे जोड़ने के साथ इसे हटाने की कोशिश की। ऐसा लगता है कि मैं उनसे छुटकारा नहीं पा सकता हूं। मैं उन्हें कैसे हटा सकता हूं?

संपादित करें:

overflow: hidden;.scroll-content{} करने के लिए इसे स्क्रॉलबार हटा दिया, लेकिन मैं फ़ायरफ़ॉक्स पर अब और स्क्रॉल नहीं कर सकते जोड़ने के साथ। मैं अतिप्रवाह के साथ स्क्रॉलिंग कैसे सक्षम कर सकता हूं: छुपा;

Answer 1

आप ऐसा कुछ कर सकते हैं।

<style> 
    #container{ 
     height: 500px; 
     width: 200px; 
     background-color: #ccc; 
     overflow: hidden; 
    } 
    #container-inner{ 
     width: calc(100% + 17px); 
     height: 100%; 
     overflow: scroll; 
     overflow-x: hidden; 
    } 
    .content{ 
     width: 100%; 
     height: 300px; 
    } 
    .one{ 
     background-color: red; 
    } 
    .two{ 
     background-color: green; 
    } 
    .three{ 
     background-color: yellow; 
    } 
</style> 
<div> 
    <div id="container"> 
     <div id="container-inner"> 
      <div class="content one"> 
      </div> 
      <div class="content two"> 
      </div> 
      <div class="content three"> 
      </div> 
     </div> 
    </div> 
</div> 

मैं एक बेला बनाएंगे, लेकिन https://jsfiddle.net/ अभी नीचे है।