Question

I am using the below code for swipe left & right a list element in mobile jquery and I need to identify a li which is currently aligned to swiped.. code is working
fine I just need to identify the li which is swiped.

<script>
    $(function() {
        var item = $('.pan li');
        var itemWidth = item.width();
        var itemLenght = item.length;
        var scrollerWidth = itemWidth * itemLenght;
        scrollLimt = itemWidth;
        item.click(function(){
            item.removeClass('active');
            $(this).addClass('active');
        });

    var position = 0;
    function next() {
        position -= scrollLimt;
        if (position <= -scrollerWidth)
            position = 0;
        update();

    }

    function prev() {
        position += scrollLimt;
        if (position > 0)
            position = 0;
        update();
    }

    function update() {
        var pan = document.getElementById("pan");
        pan.style.OTransform = "translateX(" + position + "px)";
        pan.style.MozTransform = "translateX(" + position + "px)";
        pan.style.WebkitTransform = "translateX(" + position + "px)";
    }
        $('#pan').bind("swipeleft", next);
        $('#pan').bind("swiperight", prev);

        $("img").bind("dragstart", function(ev) { ev.preventDefault(); });
    });
</script>

Answer 1

Try this:

function update(isSwipedLeft) {
    var pan = document.getElementById("pan");
    var swipedLi = isSwipedLeft ? $(pan).prev('li') : $(pan).next('li');//this is your required li.
    pan.style.OTransform = "translateX(" + position + "px)";
    pan.style.MozTransform = "translateX(" + position + "px)";
    pan.style.WebkitTransform = "translateX(" + position + "px)";
}

And call this function like:

function next() {
    position -= scrollLimt;
    if (position <= -scrollerWidth)
        position = 0;
    update(false);

}

function prev() {
    position += scrollLimt;
    if (position > 0)
        position = 0;
    update(true);
}