jQuery click alternative for mobile devices

Question

I am using jQuery click event for toggling my navigation bar. The code I am using is something like this:

$('.nav-button').on('click', function () {

    $('.navigation, .nav-button').toggleClass('show-nav');

});

Where .nav-button is a div. Everything is fine in Android version of Chrome, but Firefox Android is not doing anything on touching the <div class="nav-button"></div>

Is there any solution, or alternative for jQuery click event for touch devices?

take a look at this [thread](http://stackoverflow.com/questions/11397028/document-click-function-for-touch-device) ;-) — Chris, Nov 26 '15 at 21:26

score 2 · Accepted Answer · answered Nov 26 '15 at 21:36

2

Use this instead:

$('.nav-button').on('click touchstart', function () {

    $('.navigation, .nav-button').toggleClass('show-nav');

});

answered Nov 26 '15 at 21:36

Nafees Anwar

6,324
2
23
42

Maxwell Nyangani · Answer 2 · 2015-11-26T21:30:59.677

0

Which jQuery are you using? I recommend using the jQuery Mobile library. Its almost the same as the jQuery . They have events that are specific to touch devices in jQuery Mobile.

eg

$("p").on("tap",function(){
  $(this).hide();
});

$("p").on("taphold",function(){
  $(this).hide();
});

$("p").on("swipeleft",function(){
  alert("You swiped left!");
});

edited Nov 26 '15 at 21:30

answered Nov 26 '15 at 21:28

Maxwell Nyangani

1
1

Do I have to install jQuery mobile separately with normal jQuery? – Nafees Anwar Nov 26 '15 at 21:30
You can put a second link to the jQuery Mobile file in your html file – Maxwell Nyangani Nov 26 '15 at 21:32

score 0 · Answer 3 · edited May 23 '17 at 10:29

I found another thread on this topic on stackoverflow: jQuery click event not working in mobile browsers

As my previous speaker mentioned you could try it with jQuery Mobile. There is something similiar to the click event handler which is called vclick in jQuery Mobile:

Here a small example how it looks like:

$(document).ready(function(){
    $('.nav-button').vclick(function() {
        $('.navigation, .nav-button').toggleClass('show-nav');
    });
});

jQuery click alternative for mobile devices

3 Answers3