hide input type=“range” slider-thumb in webkit

问题

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.

回答1:

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?

来源：https://stackoverflow.com/questions/20111315/hide-input-type-range-slider-thumb-in-webkit