css jquery ui slider customize

Question

i am looking at firebug but i can only see two elements

how can i turn this

enter image description here

into, for example this?

enter image description here

Do i have to manually add a class or something?

this is how i init

.slider({
                    value : $(this).attr('data-value'),
                    min: 0,
                    max: 100,
                    step: 5,
                    disabled: true,
                    slide: function( event, ui ) {  }

});

Chamika Sandamal · Accepted Answer · 2012-03-03 17:56:34Z

2

$("#slider-range-min").slider({
    range: "min",
    value: $(this).data('value'),
    min: 1,
    max: 700,
    slide: function(event, ui) {
        ....
    }
});

http://jqueryui.com/demos/slider/#rangemin

answered Mar 3, 2012 at 17:56

Chamika Sandamal

24.4k5 gold badges68 silver badges88 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Toni Michel Caubet Over a year ago

thanks! with this and .ui-slider-range-min{background:black} i achieved it, maybe you want to edit and add the clasname ;)

Chamika Sandamal Over a year ago

i just wanted to show how it could done. customization is up to you :)

Collectives™ on Stack Overflow

css jquery ui slider customize

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related