用的mouseenter和鼠標離開對iPad

處理我有一個典型的看下拉由默認，但通過下面的jQuery魔術用的mouseenter和鼠標離開對iPad

<ul class="navNew"> 
    <li class="test"> 
     <a href="#">OPTION</a> 
     <ul> 
      <li>Suboption -- Hidden</li> 
     </ul> 
    </li> 
</ul> 

$(".navNew li").unbind('mouseenter mouseleave').bind('mouseenter mouseleave', function() { 
    $(this).toggleClass('hover');         
});

用的mouseenter和鼠標離開，類「懸停」

所以隱藏菜單被添加到菜單中以使其可見或將其關閉以使其不可見。

這一切工作就像一個魅力，問題是在iPad上。單擊將作爲一個mouseenter，但再次單擊該按鈕不會充當mouseleave，因此菜單不會再次關閉。此代碼是否可以修改，以便點擊打開並關閉此菜單？

我創建了一個的jsfiddle解釋一下我的菜單是這樣做的：http://jsfiddle.net/qgrt5/

來源

2013-03-24 Mark

使用「的onclick」事件HTTP：// WWW。 w3schools.com/jsref/event_onclick.asp – 2013-03-24 15:51:53

@JoeDF我還想保持懸停功能。如果我增加一個點擊綁定，然後單擊工作，但如果你點擊後，移動鼠標離開它會切換懸停所以它會被逆轉（可見當鼠標處於關閉狀態） – Mark 2013-03-24 15:53:36

姆......這是否幫助？ http://www.w3schools.com/js/tryit.asp?filename=tryjs_events_mouseover – 2013-03-24 15:58:52

-3

工作例如： http://jsfiddle.net/qgrt5/

編輯：下面的代碼現在將檢查用戶是否從iPad來，如果是這樣，它會使用click功能，而不是mouseenter

var isiPad = navigator.userAgent.match(/iPad/i) != null; 

if (isiPad) { 
    $(".navNew li").unbind('mouseenter mouseleave').bind('mouseenter mouseleave', function() { 
     $(this).toggleClass('hover');          
    }); 
} 
else { 
    $(".navNew li").unbind('mouseenter mouseleave').bind('mouseenter mouseleave', function() { 
     $(this).toggleClass('hover');          
    }); 
}

來源

2013-03-24 16:04:48

它與點擊的工作，但我想保持懸停功能也是如此。這裏的關鍵是要有除了懸停點擊工作，以便將懸停 – Mark 2013-03-24 16:24:42

功能@馬克我已經更新，以便它使用點擊和懸停 - 和檢測的iPad – 2013-03-24 16:29:06

這不會檢測到任何其他類型的平板電腦。 iPad是少數。 – 472084 2013-08-06 12:39:36

用的mouseenter和鼠標離開對iPad

回答

相關問題