0

デスクトップでうまく機能する 3 レベルのメニューがあります。

2 番目のレベルにカーソルを合わせると、3 番目のレベルがドロップダウンとして表示されます。

iPad では、3 層目のメニューが表示されていますが、リンクを読み込むにはシングル クリックではなくダブル クリックが必要です。

これを読んで、iPad はホバー効果をサポートしていないが、jQuery のクリック イベントで動作することが原因であることがわかりました。

これは、第 2 レベルにカーソルを合わせると第 3 レベルのメニューが表示されるようにする私の jQuery です。

    $('#primary-menu ul li ul.children li').mouseover(function(){
    mysubnav= $(this).children('ul.children');


    mysubnav.css({'left':$(this).position().left}).show();
});
$('#primary-menu ul li ul.children li').mouseout(function(){

    $(this).children('ul.children').hide();
});

iPad のサポートのためにこれを修正する方法がわかりません。

これを、表示されているコードの上にあるドキュメントの先頭に追加しようとしましたが、違いはありませんでした:

//ipad and iphone fix
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) ||            (navigator.userAgent.match(/iPad/i))) {
$("#primary-menu ul li ul.children li").click(function(){

    mysubnav= $(this).children('ul.children');

    mysubnav.css({'left':$(this).position().left}).show();
});
}

どんな助けでも大歓迎です。

ありがとう

4

1 に答える 1

1 
    var clickHandler = (/iPhone/i.test(navigator.userAgent) || /iPad/i.test(navigator.userAgent) || /iPod/i.test(navigator.userAgent) ? "mouseover" : "click") ;

    $('#primary-menu ul li ul.children li').on(clickHandler, function() {
        mysubnav= $(this).children('ul.children');
        mysubnav.css({'left':$(this).position().left}).show();
    });
于 2013-10-17T19:24:19.563 に答える