iPad ios 13.1 menu item link problem

[pitcock]

on my ipad with ios 13.1, the submenu can be opened with a touch of the first level menu item. however, the link on the first level menu item doesn't work then.

[stephangrass]

Hi. Same problem here.

You have to tap 3 times quickly ... but this ist not really a solution ;-)

The problem occures on ipads with iOS greater than 13.x.

[joeldbirch]

Thank you both for the report. I imagine the issue is due to Apple adding mouse support to iOS Safari. Unfortunately, I won’t have time to look at a fix until mid December at earliest.

I have an interesting CSS fix in mind. In fact, I don’t use Superfish anymore as I find everything with pure CSS, nowadays. Hoping to chance to put together a pure CSS example with feature parity so we can cut the jQuery ties once and for all.

[stephangrass]

Hi Joel,
thanks for your response. I think pure css will be a solution. But I use superfish in several websites and it will be terrible to change them all.

For a quick & dirty solution this will work (I think):

Add

if(navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1) { return this; }

at the beginning of touchHandler = function (e)

Hoping to chance to put together a pure CSS example with feature parity so we can cut the jQuery ties once and for all.

Joel, if you will/can do this (or fix superfish seriously), I will help by sponsoring.

Stephan

[pitcock]

this solution works for me. many thanks. a pure css solution would of course be future-proof, but i like the hoverintent integration very much.

[zhrance]

Thank you both for the report. I imagine the issue is due to Apple adding mouse support to iOS Safari. Unfortunately, I won’t have time to look at a fix until mid December at earliest.

I have an interesting CSS fix in mind. In fact, I don’t use Superfish anymore as I find everything with pure CSS, nowadays. Hoping to chance to put together a pure CSS example with feature parity so we can cut the jQuery ties once and for all.

Really looking forward for your pure CSS solution. These days I was hesitating to keeping using Superfish or create my own pure CSS solution. With this confirmation I start coding some pure CSS. If you want to I can share my code.

[twisk]

+1

[renderorange]

We see this issue also on iOS 13.5.1 for iPhone, but the fix noted above in issuecomment-549307916 doesn't appear to work.

My best guess is the issue is related to the timeout not being reset for iOS devices. As noted previously, if you click 3 times very quickly you can get the link to work, but it's not a normal speed most people will use their phones.

If you remove the iOS specific logic from the out function, it appears to work correctly.

out = function () {
    var $this = $(this),
        o = getOptions($this);

    clearTimeout(o.sfTimer);
    o.sfTimer = setTimeout($.proxy(close, $this, o), o.delay);
},

I tried to find comments in the commit history explaining why the iOS devices don't have the same logic to clearTimeout and setTimeout, but wasn't able to find much. Any insight to why iOS is set to operate differently would be helpful.

[joeldbirch]

I don’t remember why it was so important to prevent applying the delay to iOS, but it was surely a product of it not needing hover behaviour. Now iOS supports pointers, I imagine Apple have shuffled a bunch of things around, no doubt affecting Superfish’s ancient functionality.

[stevengliebe]

Thanks @renderorange, did the trick for me. Funny thing is that I only saw the issue on two out of five implementations of Superfish (all same version, checking with Chrome on iPad). There might be a factor additional to iOS.

[wpexplorer]

None of these solutions seem to be working for me (using superfish+hoverIntent). Any other ideas?

[stevengliebe]

@wpexplorer This is my modified version. Didn't see it working until cleared cache and reloaded a few times.

https://demos.churchthemes.com/jubilee/wp-content/themes/jubilee/js/lib/superfish.modified.js

[wpexplorer]

@stevengliebe - I actually got it working with some changes, I'll check yours out though to compare. Thanks!!

[kimisgold]

I'm still having this issue on iPadOS 14.6. I've tried both the latest version of superfish and @stevengliebe's modified version to no avail. You can only click through to the top level link by tapping thrice quickly. Can anyone provide guidance?

[wpexplorer]

@kimisgold - This is what I use with success: https://gist.github.com/wpexplorer/95ad7b5e5779fc68a8816c323f5f9976

[kimisgold]

@wpexplorer I cleared cache and used your gist. Ideally a second click would click through to the top link destination: your modification now enables click through on the third click even at slower tap speeds.

[wpexplorer]

@kimisgold - I don't know how your testing (how slow your taps are) but for me it works on the second tap not the 3rd when tapping on it normally.

(edit, I'm also using the HoverIntent plugin...forgot to mention)

[djmolny]

@kimisgold - This is what I use with success: https://gist.github.com/wpexplorer/95ad7b5e5779fc68a8816c323f5f9976

+1. Thanks!