Comments (17)
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.
Related Issues (20)
- SuperfishForSharePoint HOT 1
- Mobile menu not working 🤔 HOT 1
- jQuery easing animation support
- Way to disable all delays and animations HOT 2
- On Mobile (Google Pixel) on wordpress, selecting a submenu opens and rapidly closes the submenu HOT 1
- v1.7.9 confict with WooCommerce single product tabs navigation HOT 1
- issues with jquery 3.2.1 HOT 3
- onShow triggered again when clicking menu
- how to initialize superfish using javascript HOT 1
- Swiping to scroll opens submenu
- mouseenter targets vs focusin targets HOT 2
- On mobile submenus not showing HOT 1
- Superfish doesn't work correctly
- Close the current submenu by using escape HOT 5
- Busted link in the README HOT 1
- jQuery Superfish Menu Plugin
- Homepage implies it contains examples, on their own page
- jQuery(...).superfish is not a function HOT 2
- Is there a support for accessibility for using this menu library. looking for aria-expanded attribute usage in this menu
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from superfish.