views:

32

answers:

0

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