angularjs-slider
angularjs-slider copied to clipboard
Style bar outside minLimit/maxLimit bounds
Check out the example "Range slider with min limit set to 10 and max limit set to 90" from the example pages.
It would be very neat if we were able to style the part of the bar that is outside the given bounds (e.g. 0-10 and 91-100) in a different style so we could clearly show this part of the bar is not available.
Today it's not possible to do it via the library, but you can use a short workaround via CSS gradient background:
background: linear-gradient(to right, #c60600 0%,#c60600 10%,#d8e0f3 10%,#d8e0f3 90%,#c60600 90%,#c60600 100%)
Demo: http://jsfiddle.net/q3a27bne/
Sure thing. It gets slightly more complicated with dynamic limits though, but I can absolutely still do it by just querying the DOM. This was meant as a feature request, sorry if this is not the correct forum for it.
No it's the right place to submit features request! I was just providing a workaround for now. If you want to provide a pull request adding this feature, you are welcome. :)