search

fryn / html5slider

<input type=range> polyfill for Firefox
http://fryn.github.io/html5slider/
180 stars 48 forks source link

Vertical slider #24

Closed Seb-C closed 10 years ago

Seb-C commented 10 years ago

First, thank you for this job, that's really useful.

I want to make a vertical slider, but it doesn't works in the latest version of Firefox. When a slider has height > width, it has to be vertical.

I tried a hack with transforms (rotate), but after that, mouse events doesn't works on it so I can't change it's value with the mouse.

Can you please fix it ?

Thank you.

fryn commented 10 years ago

Firefox 23 was released today, and it has built-in support for <input type="range" />, so this polyfill is no longer needed. http://caniuse.com/input-range

To make the slider vertical in Firefox, Chrome, and Safari, use <input type="range" orient="vertical" style="-webkit-appearance: slider-vertical;" />. The orient attribute is recognized by Firefox, whereas -webkit-appearance is recognized in Chrome and Safari.