How to detect html elements on touchmove

I've a series of list items. On an iphone (touch device), as a user touches and moves his finger across the screen, I want to capture all the html li elements that he has touched.

So how do I get that? Say I want to get all the ids of those elements and alert is when the touch ends.

I tried with jQuery Mobile with "swipe' event but only the first one to be touched, that too if the 'touch' starts from that particular element shows up.

Answers:

Answer

Not sure if this will work on a mobile device unless you disable scrolling.

Works for desktop and kinda on my iPhone

JS

// List of events: http://api.jquery.com/category/events/
// tap taphold swipe swiperight swipeleft
// click change dblclick submit
function bindEvents(element) {
    element.bind('mouseenter', function(event) {
        //alert('Element Id: '+$(element).attr('id')+' Event: '+event.type);
        console.log('Element Id: '+$(element).attr('id')+' Event: '+event.type);
    });
}

$('#theList li').each(function(){
    bindEvents($(this));
});

HTML

<div data-role="page" class="type-home">
    <div data-role="content">

        <ul id="theList" data-role="listview" data-inset="true" data-theme="c" data-dividertheme="f">
            <li id="list-d" data-role="list-divider">Items</li>
            <li id="list-item-1"><a href="#">List Item 1</a></li>
            <li id="list-item-2"><a href="#">List Item 2</a></li>
            <li id="list-item-3"><a href="#">List Item 3</a></li>
            <li id="list-item-4"><a href="#">List Item 4</a></li>
            <li id="list-item-5"><a href="#">List Item 5</a></li>
            <li id="list-item-6"><a href="#">List Item 6</a></li>
            <li id="list-item-7"><a href="#">List Item 7</a></li>
            <li id="list-item-8"><a href="#">List Item 8</a></li>
            <li id="list-item-9"><a href="#">List Item 9</a></li>
            <li id="list-item-10"><a href="#">List Item 10</a></li>
        </ul>

    </div>
</div>

I'm sure you could bind multiple events and log them to find the right combo you're looking for.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.