JS distinguish click and scroll on iPhone

Question

I'm trying to close a Sidemenu onclick. however, touchstart also detects scrolling as a click, so is touchend. how to just detect a click (not a scroll) on iPhone?

  $('#html').on("click touchstart",function(e) {
      var optionsmenue = $(".adminmenu_label");
      if(!optionsmenue.is(e.target) && optionsmenue.has(e.target).length === 0) {
        document.getElementById("Optionsmenu").style.width = "0%";
        document.getElementById("Optionsmenu").style.transition = "0.2s ease-out";
        document.getElementById("adblue").style.display = "block";
        document.getElementById("whatever").style.display = "block";  
        document.getElementById("not_related").style.display = "block";
        document.getElementById("still_not_related").style.display = "block"; 
        document.getElementById("still_still_not_related").style.width = "100%"; 
      }
    });

You can do some combinations like it's mentioned here: https://stackoverflow.com/a/38550335/849516 — Lachezar Todorov, Jan 30 '18 at 08:23

Alexander Solonik · Accepted Answer · 2018-01-30T10:33:45.417

3

Detecting for iOS and adding cursor:pointer works for me , IOS seems to have a problem with event delegation.

var iOS = ["iPad","iPhone","iPod"].indexOf(navigator.userAgent) > -1;

if(iOS) {
   $('body').css({ cursor : 'pointer' });
}

$('#html').on("click",function(e) {
    // No need for touch start click will do the trick;
});

edited Jan 30 '18 at 10:33

answered Jan 30 '18 at 08:33

Alexander Solonik

9,838
18
76
174

1

@tipsfedora your welcome , useragent detection is't the best of solutions though and i'd urge you to find a better one in your free time :) – Alexander Solonik Jan 30 '18 at 08:49
1

I should suggest that you replace the regex with simpler solution like ["one", "two", "three"].indexOf("one") >= 0 (take in mind the equal sign!) – Lachezar Todorov Jan 30 '18 at 09:06
1

My idea is that regex is heavy engine, indexOf is way more resource saving solution. – Lachezar Todorov Jan 30 '18 at 09:07
1

ok, this way it doesn't work. Try this: ["iPad", "iPhone" ,"iPod"].indexOf(navigator.platform) > -1; |-| 10x to https://stackoverflow.com/q/19877924/849516 – Lachezar Todorov Jan 30 '18 at 09:28

score 0 · Answer 2 · answered Jan 30 '18 at 08:19

0

should remove "touchstart" in

$('#html').on("click touchstart",function(e) {

answered Jan 30 '18 at 08:19

Khoi Ngo Nguyen

164
5

iPhone doesn't detect "click" – David Jan 30 '18 at 08:20

JS distinguish click and scroll on iPhone

2 Answers2