隐藏输入类型=“范围”在webkit中的滑块拇指 [英] hide input type="range" slider-thumb in webkit

问题描述

直到safari 5.1，也许6.0可以隐藏滑块拇指通过css

  input [type = range] .onoff ::  -  webkit-slider-thumb，
 input [type = range] .onoff ::  -  moz-slider-thumb，
 input [type = range] .onoff :: slider-thumb { 
 -webkit-appearance：none！important; 
 -moz-appearance：none！important; 
外观：无！重要; 
 height：20px;宽度：20像素; 
 background-color：transparent; 
} 
  

也可以在chrome，ff和opera中使用。 b

现在用safari 6.1和6.1.1，firefox 25
，这个CSS不再隐藏滑块。
我错过了什么？
是否有一个更好，更有效的代码，我可以用来隐藏大拇指？

没有jQuery解决方案，请工作在本地JavaScript插件添加可触摸的音频轮，在不同的环境中工作。也许以后我会把它翻译成jQ。

解决方案

好的testet ..

看起来像是，逗号分隔的选择器列表并将它们全部设置为不再有效。所以有效的代码可以是..

  input [type = range] .onoff ::  -  webkit-slider-thumb {
 -webkit-appearance：none; 
} 
 input [type = range] .onoff ::  -  moz-slider-thumb {
 -moz-appearance：none; 
} 
 input [type = range] .onoff :: slider-thumb {
 appearance：none; 
} 
  

但是FF仍然不能隐藏拇指，怎么样？ p>

until safari 5.1 and maybe 6.0 it was possible to hide the slider-thumb via css

input[type=range].onoff::-webkit-slider-thumb,
input[type=range].onoff::-moz-slider-thumb,
input[type=range].onoff::slider-thumb {  
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    height:20px; width:20px;
    background-color:transparent;
}

worked also in chrome, ff and opera.

now with safari 6.1 and 6.1.1, firefox 25 this css is not hiding the slider-thumb anymore. what did i miss? is there a better, more valid code i could use to hide just the thumb?

no jquery solutions please, i work on a native javascript plugin to add touchable audio-wheels, working in different environments. maybe later i will translate this to jQ too.

解决方案

okay testet..

looks like, the comma separated list of selectors and setting them all ot once is not working anymore. so valid code can be..

input[type=range].onoff::-webkit-slider-thumb {
    -webkit-appearance: none;
}
input[type=range].onoff::-moz-slider-thumb {
    -moz-appearance: none;
}
input[type=range].onoff::slider-thumb {
    appearance: none;
}

but still in FF i can't hide the thumb, how?

这篇关于隐藏输入类型=“范围”在webkit中的滑块拇指的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！