Hello everybody, I'm trying to make a better useable scrollbar (horizontal and vertical) for a touch screen. Everything works well except that some events don't seem to be supported by the slider plugin of jQuery (using 1.4.2 currently).
Situation: I've made a div with overflow hidden and I'm overlaying the slider over the normal browser-slider.
Syntax:
$("#content-slider").slider({ animate: true, max: $("#scrl").attr("scrollWidth"), handle: ".ui-slider-handle", change: handleSliderChange, slide: handleSliderSlide });
function handleSliderChange(e, ui) {
$("#scrl").animate({ scrollLeft: ui.value }, 1000);
}
function handleSliderSlide(e, ui) {
$("#scrl").attr({ scrollLeft: ui.value });
}
This works well - except: If I touch into the div and swipe the finger it scrolls the content - but not the slider handle. I can also recreate this problem with the keyboard or the mouse wheel (if vertical). If I'm scrolling trough the div with the right cursor, the position of the content changes - handleSliderChange fires but ui.value is no different.
Does anybody know a workaround to this problem?
Any help is greatly appreciated!
Best Regards Marc