Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Style bar outside minLimit/maxLimit bounds #500

Open
bodinaren opened this issue Feb 14, 2017 · 3 comments
Open

Style bar outside minLimit/maxLimit bounds #500

bodinaren opened this issue Feb 14, 2017 · 3 comments

Comments

@bodinaren
Copy link

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.

@ValentinH
Copy link
Member

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/

@bodinaren
Copy link
Author

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.

@ValentinH
Copy link
Member

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. :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants