JQuery UI Slider + go to Max Position

Question

I have the following JQUERY UI Slider Code working:

$('div#chatFriendsSliderPath').slider({
    orientation: 'vertical',
    animate: 'fast',
    change: handleSliderChange,
    slide: handleSliderSlide,
    range: 'min',
    min: 0,
    max: 100,
    value: 100
});

I have a button at the top and bottom and what these to move the slider to the top/max or bottom/min position. Code below.

// Chat Contacts - Scroll to Top
$(document).on('click','img#chatContactsSliderBarTop', function() {
    alert('top...');
}); 

// Chat Contacts - Scroll to Bottom
$(document).on('click','img#chatContactsSliderBarBottom', function() {
    alert('bottom...');
});

What do I need to put in place of the alert code to get the slider to move the extremities?

Note: there is also code for change/slide that I haven't put here.

score 0 · Accepted Answer · answered Sep 30 '12 at 04:54

0

TO set to max:

$('div#chatFriendsSliderPath').slider( "option", "value", 100 );

TO set to min

$('div#chatFriendsSliderPath').slider( "option", "value", 0 );

answered Sep 30 '12 at 04:54

Sidharth Mudgal

4,234
19
25

score 0 · Answer 2 · answered Sep 30 '12 at 04:57

You should use some thing like this :

// Chat Contacts - Scroll to Top
$(document).on('click','img#chatContactsSliderBarTop', function() {
    $('div#chatFriendsSliderPath').slider( "option", "min", 0);
}); 

// Chat Contacts - Scroll to Bottom
$(document).on('click','img#chatContactsSliderBarBottom', function() {
    $('div#chatFriendsSliderPath').slider( "option", "max", 100);
});

Hope this will help !!

JQuery UI Slider + go to Max Position

2 Answers2