Searched for stepped and range sliders.
Can you tell me what its called, plz.
No one?
Oh well. Will ask elsewhere
When I look in the source, it looks like a heavily modified jQuery UI slider.
Ive seen heaps of them , but i always forget to bookmark or look at src code. And then i try n find one and bugger me i cant find one for sh1t.
They must have a name…
. . . Bumperttybumppp
That’s definitely a modded JQuery.
What are you trying to achieve? The elastic type property when you release the slider as it goes back to a fixed point, or just the slider in general?
The slider I have made, using jquery ui. And customised with images etc.
Yeah I was looking for that snap to elasticity .. happy to share code I have so far.
If need be will throw up a fiddle, or stick it on a demo area.
Its just something I want to be able to do, and then find a need to use it lol.
Yeah go for, I might put together today if I have time on js.fiddle too.
I was actually looking into drag and drop the other day
Was thinking something along the lines of http://www.elated.com/res/File/articles/development/javascript/jquery/drag-and-drop-with-jquery-your-essential-guide/card-game.htmlAnd freezing just the vertical movement…
For example: http://interface.eyecon.ro/docs/dragAnd this
http://interface.eyecon.ro/demos/drag.htmlseem good references to start off with at least…
Threw up a demo:
http://sitehelp.com.au/demos/stepped/Issue seems to be moving the slider, by a percentage >> should really be by 33% increments for this example. But if I set the slide rule to 100% to facilitate this I lose control ..
I borrowed lol, the images from the original links site, for the demo .. but all the code is from jQuery ui itself.
I think initially, need to get the maths working …so the snap to points line up with the circular elements…
I set the scale to 500px even though the image is 508px .. and in the code: had to perform a workaround for stepped sizing, I guess my maths is totally wrong..
$(function() {
$( "#slider" ).slider({
value:125,
min: 0,
max: 500,
step: 167,
slide: function( event, ui ) {
$( "#amount" ).val( "$" + ui.value );
}
});
$( "#amount" ).val( "$" + $( "#slider" ).slider( "value" ) );
});
I am more inclined to think that the image scaling is out of whack, in terms of the snap points. I hadnt thrown this on photoshop to check …
Looks like you’re getting there… Well at least, when you mouse over half way it snaps to the right position.
All you need to do is get the pointer to move and then lastly the elastic effect.
