Firefox 21 bug causes the original range element to remain visible

[acdha]

See https://bugzilla.mozilla.org/show_bug.cgi?id=872351: FF21 shipped with some partial code for the native implementation which will ship in FF22/23, which has the key problem of setting display: inline-block !important; on all <input type="range"> elements, which cannot be overridden by normal CSS rules.

If they don't decide to ship a point release with a fix, we're stuck needing to do something ugly like a version sniff and wrapping the original input control in a display:none span. This works - see http://jsfiddle.net/acdha/pvNV3/2/embedded/result/ - but it's definitely ugly.

[acdha]

One other option would be updating the polyfill to change the type of the original input to either number or text when the slider initializes:

http://jsfiddle.net/acdha/pvNV3/4/embedded/result/

[freqdec]

Hi, I've added code that sets the "fd-slider-hidden" class and then checks the input element's computedStyle to see if the value for "display" is still "inline-block". If so, the input's type gets mutated to "number".

Many thanks for the detective work that enabled me to do this!