Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

New Widget: Range Slider #5355

Closed
arschmitz opened this Issue · 9 comments

3 participants

@arschmitz
Owner

Create a new range slider widget which will be a two handled slider
current demo http://uglymongrel.com/jqm/range.html
also in range branch

@arschmitz arschmitz was assigned
@jerone

Some feedback:

Sometimes one of the handles gets beyond the other handles.

Can you make it so that, if you select the bar on the left from the left handle, it will adjust the left handle, even if it has focus on the right handle (if it make sense). And visa versa.

Maybe an option to adjust the left handle if you slide the right handle further to the left than the left handle is (and visa versa). Like I did here: http://jerone.github.com/jQueryMobileRangeSlider/

Good work.

@arschmitz
Owner

@jerone clicking on a handle and then clicking on the track will adjust that handle this is inline with how typical two handle sliders work and how the UI range slider works.

As far as pushing the handles my personal opinion is that this will make it too hard to do narrow ranges on touch devices because it will be to easy to push the other handle.

@jerone

Sometimes one of the handles gets beyond the other handles.

I found out that's because the slider has more steps then the difference between min and max. Tested in FF18 and Chrome 25 precisely on value 47. If you drag it, you'll note it has two 47 values.

clicking on a handle and then clicking on the track will adjust that handle this is inline with how typical two handle sliders work and how the UI range slider works.

If you click the left handle to give it focus and click from the left on the left handle, the right handle will adjust. Which then should be the left handle.

As far as pushing the handles my personal opinion is that this will make it too hard to do narrow ranges on touch devices because it will be to easy to push the other handle.

That's why maybe an option.

Found another bug: resizing browser (or switching landscape and portrait) won't update the highlight correctly (tested on FF18 and Chrome 25).

@arschmitz
Owner

@jerone Thanks for looking into them not matching exactly I'll adjust the demo to use real values here and it should fix this

As far as the clicking to move I can't reproduce this right now but I'll give it a better look as well as the highlight updating properly on orientation change this weekend

As far as a push mode we discussed this today and we are not going to add this option it has usability issues. However the slider could be easily extended to add this if you wanted. We will consider a demo for it though

@arschmitz
Owner

@jerone Did some updates over the weekend fixed the issue you noticed with the highlight. Also implemented what you mentioned with making it so if you click the track on either extreme it will adjust the closest slider.

The issue with the handles not lining up is actually an issue with our base slider not properly respecting steps.
I fixed this.

I also wrote an extension to allow for the push mode you mentioned.

All of these updates are reflected in the demo

@jerone

@arschmitz very cool. Just tested it on my desktop and iPad and working great!

The one with clicking on the track, as soon as you drag instead of click (press) it will drag the other handle. Need to be careful with that one.

Found one issue (I think a base slider bug); the highlight from the slider is below other elements and is cut off (confirmed on desktop FF & Chrome and iPad):
Untitled

@arschmitz
Owner

@jerone thanks for taking a look. on the track clicking. I am aware of this right now there isnt a way around it but the purpose of this is really to support things like WP7 where there are no touch events so this wont be an issue there im looking at solutions for this but nothing yet.

The highlight being cut off its actually an issue in range still fine tuning the css for range and will need to adjust for this.

@frequent

:+1: can't wait to kick my drop-2-single-sliders-on-top-of-each-other out of the door :-)

@arschmitz
Owner

range sliders are now merged into master and will be part of 1.3

@arschmitz arschmitz closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.