Dancer
Dancer

Reputation: 17651

Jquery Mobile - On press event?

Is it possible to act on a button press gesture via jquery? We would like a tab to change colour as a user presses it - so basically need an on-press or something similar? I've seen this before on other sites but cant figure out how to do it.

Thanks for your time!

Cheers Paul

Upvotes: 2

Views: 2399

Answers (4)

suraj jain
suraj jain

Reputation: 1032

I wanted to hide a div1 when user touches somewhere on div2.

Just using click or tap didn't serve purpose.. so ended up using following

To capture all sorts of touch events use

$('#div2').bind('tap click swipe focus', function() {
   $('#div1').hide();
});

Upvotes: 0

Phill Pafford
Phill Pafford

Reputation: 85318

Related:

Live Example:

JS:

$('#custom-li-1').click(function() {
    $(this).attr('data-icon','star');
    $(this).children().children().next().removeClass('ui-icon-custom').addClass('ui-icon-star');
}).page();

$('#custom-li-2').click(function() {
    $(this).attr('data-icon','home');
    $(this).children().children().next().removeClass('ui-icon-grid').addClass('ui-icon-home');
}).page();

$('#custom-li-3').click(function() {
    $(this).attr('data-icon','grid');
    $(this).children().children().next().removeClass('ui-icon-star').addClass('ui-icon-grid');
}).page();

HTML:

<div data-role="page" id="home">
    <div data-role="header" data-theme="b">
        <h1>Test</h1>
    </div>
    <div data-role="content" data-theme="d">
        <div data-role="navbar" data-theme="d">
            <ul id="custom-nav-list">
                <li><a href="#" data-icon="custom" class="ui-btn-active" id="custom-li-1">Home</a></li>
                <li><a href="#" data-icon="grid" id="custom-li-2">Second page</a></li>
                <li><a href="#" data-icon="star" id="custom-li-3">Third page</a></li>
            </ul>
        </div>
    </div>

</div>

Upvotes: 1

Naning
Naning

Reputation: 734

You can bind the tap event.

$('#id').bind('tap', function( event, data ){ //code };

Read more here: http://jquerymobile.com/demos/1.0rc1/docs/api/events.html

Upvotes: 2

Alex Turpin
Alex Turpin

Reputation: 47776

Just use a normal jQuery .click event.

Upvotes: 1

Related Questions