CodeCanyon

What kind of slider is this ?

3390 posts
  • Australia
  • Bought between 100 and 499 items
  • Exclusive Author
  • Has been a member for 2-3 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Sold between 1 000 and 5 000 dollars
Australia says
http://online-audio-converter.com/

Searched for stepped and range sliders.

Can you tell me what its called, plz.

3390 posts
  • Australia
  • Bought between 100 and 499 items
  • Exclusive Author
  • Has been a member for 2-3 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Sold between 1 000 and 5 000 dollars
Australia says

No one?

Oh well. Will ask elsewhere

326 posts
  • Netherlands
  • Sold between 10 000 and 50 000 dollars
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Exclusive Author
  • Bought between 10 and 49 items
  • Referred between 10 and 49 users
  • Has been a member for 2-3 years
RikdeVos says

When I look in the source, it looks like a heavily modified jQuery UI slider.

3390 posts
  • Australia
  • Bought between 100 and 499 items
  • Exclusive Author
  • Has been a member for 2-3 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Sold between 1 000 and 5 000 dollars
Australia says

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…

3390 posts
  • Australia
  • Bought between 100 and 499 items
  • Exclusive Author
  • Has been a member for 2-3 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Sold between 1 000 and 5 000 dollars
Australia says

. . . Bumperttybumppp

812 posts
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 3-4 years
iamthwee says

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?

3390 posts
  • Australia
  • Bought between 100 and 499 items
  • Exclusive Author
  • Has been a member for 2-3 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Sold between 1 000 and 5 000 dollars
Australia says

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.

812 posts
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 3-4 years
iamthwee says

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.html

And freezing just the vertical movement…

For example: http://interface.eyecon.ro/docs/drag

And this

http://interface.eyecon.ro/demos/drag.html

seem good references to start off with at least…

3390 posts
  • Australia
  • Bought between 100 and 499 items
  • Exclusive Author
  • Has been a member for 2-3 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Sold between 1 000 and 5 000 dollars
Australia says

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 …

812 posts
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 3-4 years
iamthwee says

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.

by
by
by
by
by