iPad ios 13.1 menu item link problem about superfish HOT 17 OPEN

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.

from superfish.

@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

from superfish.

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.

from superfish.

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.

from superfish.

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

from superfish.

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.

from superfish.

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.

from superfish.

+1

from superfish.

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.

from superfish.

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.

from superfish.

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

from superfish.

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

from superfish.

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?

from superfish.

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

from superfish.

@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.

from superfish.

@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)

from superfish.

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

+1. Thanks!

from superfish.