iOS hover causes the user to double click a link

We have found through building some websites for various clients that when using jQuery mouse events, on iOS mouse over events are turned into clicks. So that means any hover events are executed on the first click and then the click events are executed on the second click.

On stackoverflow, cduruk provided some code that will work assuming you are using jQuery. The following function will help prevent the behaviour described above:

$('a').on('click touchend', function(e) {
var el = $(this);
var link = el.attr('href');
window.location = link;

This will listen for touchend events that are fired on Mobile Webkit and it will redirect the browser to the link instead of showing the hover.

It's only fair to share...
Share on Facebook
Tweet about this on Twitter
Share on LinkedIn