jQuery UI Slider - Animation of handle and scroll content not in sync
- by Mayko
Im having troubles getting the jQuery UI Slider customized for my purposes.
On load the slider and its content should automatically animate to a certain position. Ideally it should animate to the very right, then stop and then animate back (as a loop) as long as the user doesn't hovers over scroll content or slider.
Following my default slider setup (http://jsfiddle.net/mayko/j6WuE/1/):
var scrollbar = $("#slider").slider({
animate: 3000,
min: 0,
max: $("#timeline_content .items").width(),
change: handleSlider,
slide: handleSlider
});
function handleSlider(e, ui) {
$("#timeline_content").stop().animate({scrollLeft: ui.value}, scrollbar.slider("option", "animate"));
}
If i now try to set the value like this:
$('#slider').slider({'value': 1000});
The scroll content nicely animates, but the handle just jumps to that new position.
Even if I click on the slider track itself the animation of scroll content and slider handle are not in sync.
Does anyone got a solution?
