Problem with navigation touch events (menu not working on ipad)

[kallkwik]

Navigation touch events are not working on the past few websites i've built. The 1st finger press will open the navigation menu and then the second event will simply close the website.

Testing on iPad with iOS 10.12 (latest at the time).

You can test on the website here: https://www.sports2000.co.uk/

Im presuming its an issue with the theme rather than my setup as it doesn't work on a blank install for me.

Running node v6.9.1.

FoundationPress version 2.8.0

"devDependencies": {
"autoprefixer": "^6.1.0",
"babel-core": "^6.5.2",
"babel-plugin-transform-es2015-arrow-functions": "^6.3.13",
"babel-plugin-transform-es2015-block-scoped-functions": "^6.3.13",
"babel-plugin-transform-es2015-block-scoping": "^6.4.0",
"babel-plugin-transform-es2015-classes": "^6.3.15",
"babel-plugin-transform-es2015-destructuring": "^6.3.15",
"babel-plugin-transform-es2015-modules-commonjs": "^6.3.13",
"babel-plugin-transform-es2015-parameters": "^6.3.26",
"babel-plugin-transform-es2015-shorthand-properties": "^6.5.0",
"babel-plugin-transform-es2015-spread": "^6.4.0",
"babel-plugin-transform-es2015-template-literals": "^6.3.13",
"babel-preset-es2015": "^6.5.0",
"babel-register": "^6.5.2",
"bower": "~1.6.4",
"browser-sync": "^2.10.0",
"colors": "^1.1.2",
"dateformat": "^1.0.12",
"del": "^2.2.0",
"gulp": "^3.9.0",
"gulp-autoprefixer": "^3.1.0",
"gulp-babel": "^6.1.2",
"gulp-clean-css": "^2.0.7",
"gulp-concat": "^2.6.0",
"gulp-flatten": "^0.2.0",
"gulp-if": "^2.0.0",
"gulp-jshint": "^2.0.0",
"gulp-load-plugins": "^1.1.0",
"gulp-notify": "^2.2.0",
"gulp-phpcbf": "latest",
"gulp-phpcs": "^1.0.0",
"gulp-plumber": "^1.0.1",
"gulp-sass": "^2.1.0",
"gulp-sourcemaps": "^1.6.0",
"gulp-uglify": "^1.5.1",
"gulp-uncss": "^1.0.4",
"gulp-util": "^3.0.7",
"gulp-zip": "^3.0.2",
"jshint": "^2.8.0",
"merge-stream": "^1.0.0",
"motion-ui": "^1.1.0",
"run-sequence": "^1.1.5",
"yargs": "^3.31.0"
},

[dantahoua]

Hello, I just confirm the same problem on my iPad (ios 9). You can check it here: http://wilbrod.lesaintdev.com/
In fact, even on the FoundationPress website, submenu open but link are not working! I tried a lot of stuff but can't find a way to make it work... :( Any idea?

[kallkwik]

I've not yet tried anything, however on my sites pre-foundation I use to use a libary called double tap to go.

You could set the ID and then it would do the hard work. Going to try my best to see if I can intergrate it - even if it is a stopgap 'hack' for now.

https://github.com/dachcom-digital/jquery-doubleTapToGo

[dantahoua]

Hum, Foundation is supposed to work out of the box for menu on touch device... Seems to be a bug maybe in the JS with the touch events... Wont be the first time zurb introduce such a bug.

[kallkwik]

Appears its a problem with foundation as you suspected. Its been reported to them on their github.

foundation/foundation-sites#9652

Guess its a waiting game to see if they find a fix.

[kallkwik]

I have changed the javascript file in the assets folder to an older version of foundation and its now working again.

Would recommend others do the same for the time being.

[dantahoua]

Great, I was about to do the same thing... What file did you replace? dropdownMenu.js? Or did you have to replace more file?
Oh and also, is there an easy way to get the file from an older version? I have to check in my other project, but I'm sure everything is somewhere online! ;0

[kallkwik]

I simply dropped the whole javascript assets folder from an old project to save myself time. Then re-added the specific scripts to my project.

[IamManchanda]

This is fixed in develop branch ( next version ) of foundation. Cheers !