mousemove based scrolling script need to adapt for touchscreen use

Question

I have a Javascript that scrolls an UL from left to right depending on where the mouse is positioned over it: A demo can be seen HERE (site still under construction) I would like it to work with touchscreen devices also. Whereby touching and "dragging" ones finger would scroll the UL in a similar manner, tapping on the list would then "click" on an image.

How easy/hard would that be to modify the JS:

$(function(){
    $(window).load(function(){
        var $gal   = $("#gallerylist.top"),
            galW   = $gal.outerWidth(true),
            galSW  = $gal[0].scrollWidth,
            wDiff  = (galSW/galW)-1,  /// widths difference ratio
            mPadd  = 200,  // Mousemove Padding
            damp   = 20,  // Mousemove response softness
            mX     = 0,   // Real mouse position
            mX2    = 0,   // Modified mouse position
            posX   = 0,
            mmAA   = galW-(mPadd*2), // The mousemove available area
            mmAAr  = galW/mmAA;    /// get available mousemove fidderence ratio   
        $gal.mousemove(function(e) {
            mX = e.pageX - $(this).parent().offset().left - this.offsetLeft;
            mX2 = Math.min( Math.max(0, mX-mPadd), mmAA ) * mmAAr;
        });
        setInterval(function(){
            posX += (mX2 - posX) / damp; /// zenos paradox equation "catching delay"    
            $gal.scrollLeft(posX*wDiff);
        }, 10);
    });
});

Answer 1

There are touch events similar to mouse events:

$gal.touchstart(function(e) {});
$gal.touchend(function(e) {});
$gal.touchmove(function(e) {});

Usually you don't need to implement touch events for 'click'... they are usually already in sync.

For the mousemove event, it may be more desirable from the user's perspective to have this functionality disabled on a touch device. If the page needs to scroll, this could interfere with that interaction. An alternative may be to have some animation on a window scroll event.