Question

I have a website with links that use jquery to swap out images when the links are hovered over. when the links are clicked on the image is replaced by the original and then the default action fires (the browser follows the link)

On an idevice for some reason the links require two taps to get the browser to follow the links. the first tap replaces the image (as if it is being hovered over) the second tap follows the link. Here is a snippet of the jquery code to handle the hovering and clicking.

$("#youtube").mouseenter(function(){
    $('#youtube_hover').stop(true,true);
    $("#youtube_hover").fadeIn(300);    
}).mouseleave(function(){
    $('#youtube_hover').fadeOut(300);       
}).click(function(){
    $('#youtube_hover').fadeOut(300);
});

It’s as if safari on the idevice is registering the first touch as a mousenter event and nothing else. I was hoping it would register as a click event and so move through the entire sequence in the code and then run the default action.

edit: Just to clarify: I’m not hoping the hover behavour will work on the idevice. The hover behavour is there for desktop/laptop browsers. I am simply hoping for the links to be followed when clicked once.

Answer 1

I don’t suggest using hover actions for iDevices as there is no ability to hover. Dynamically add a js for iDevices and regular browsers.