Source: https://github.com/PierBover/ios-iframe-fix.
Code source de la solution en full CSS: ios-iframe-fix-master.
Le bloc-notes professionnel d'un développeur front-end senior
Source: https://github.com/PierBover/ios-iframe-fix.
Code source de la solution en full CSS: ios-iframe-fix-master.
Sources: Solving The Double Tap Issue on iOS Devices (fonctionne) et The Annoying Mobile Double-Tap Link Issue et Demo (pas testé, plus propre mais plus chiant à mettre en place si pas prévu en amont du développement du projet).
ATTENTION: votre lien doit évidemment être présent dans le DOM au moment où vous ce code est exécuté. Sinon, prévoir une détection.
1 2 3 4 5 |
$("a").on("click touchend", function(e) { var el = $(this); var link = el.attr("href"); window.location = link; }); |
Si l’utilisateur doit pouvoir scroller, il ne faut pas que le touch sur un lien déclenche ce dernier!
1 2 3 4 5 6 7 8 9 10 11 12 13 |
var ___SCROLL_TOP_LAST___ = 0; $(".autocomplete-item").on("touchstart", function() { ___SCROLL_TOP_LAST___ = $('body').scrollTop(); console.log('touchstart: '+___SCROLL_TOP_LAST___); }); $(".autocomplete-item").on("touchend", function() { console.log('touchend: '+___SCROLL_TOP_LAST___); var el = $(this); var link = el.attr("href"); if($('body').scrollTop() === ___SCROLL_TOP_LAST___) { window.location = link; } }); |
cf. article de Chris Coyier sur CSS Tricks…