0
jQuery(document).ready(function(){
    /* for top navigation */

    jQuery("#menu ul, #menu li").css("-webkit-transform", "translateZ(0)");
    jQuery(" #menu ul ").css({display: "none"}); // Opera Fix
    jQuery(" #menu li").hover(function(){
        jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400);
    },function(){
        jQuery(this).find('ul:first').css({visibility: "hidden"});
    });

    jQuery(" #menu2 ul ").css({display: "none"}); // Opera Fix
    jQuery(" #menu2 li").hover(function(){
        jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400);
    },function(){
        jQuery(this).find('ul:first').css({visibility: "hidden"});
    });
});

このコードはdropdown.jsからのもので、www.yorkshirephotographer.netのナビゲーションメニュー用です。コードの一番上の行を追加する必要がありました。MacとIPADでメニューが正しく機能しないため、webkit変換です。これについての詳細と、このコード行をここに追加した理由を参照してください-

JavaScriptドロップダウンメニュー-Macでパーツが消えますか?

しかし、現在、メニューはモバイルデバイスでは機能しません。タップしてクリックすると、ボックスが1秒間表示されますが、メインメニューテキストの下に表示されます。たとえば、リンクの下を押すと、リンクがアクティブになりません。したがって、基本的に、メニューバーはモバイルでは機能しません。

そのコード行がなくても確認しましたが、再び機能しますが、Macでは機能しません。モバイルデバイスで無効にするか、Mac /AppleOSの場合にのみ読み取る必要があります。

助けてくださいありがとう

4

2 に答える 2

1

これを試すことができます:

jQuery(document).ready(function(){

    // If Mac, or iPad, apply the following...
    if(navigator.userAgent.match(/(Mac|iPad)/i)) {

        jQuery("#menu ul, #menu li").css("-webkit-transform", "translateZ(0)");
        jQuery(" #menu ul ").css({display: "none"}); // Opera Fix        
        jQuery(" #menu li").hover(function(){
            jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400);
        },function(){
            jQuery(this).find('ul:first').css({visibility: "hidden"});
        });

        jQuery(" #menu2 ul ").css({display: "none"}); // Opera Fix
        jQuery(" #menu2 li").hover(function(){
            jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400);
        },function(){
            jQuery(this).find('ul:first').css({visibility: "hidden"});
        });

    } // End of Mac, iPad additional fixes ----

});

PS: iPhone と iPod の追加の修正を含めたい場合は、次のように置き換えることができますif(navigator.userAgent.match(/(Mac|iPad)/i))if(navigator.userAgent.match(/(Mac|iPhone|iPod|iPad)/i))

これがお役に立てば幸いです。あなたの結果について教えてください。

于 2012-09-17T01:29:24.593 に答える
1

navigatorオブジェクトの platform プロパティから OS を取得できるはずです。

<script type="text/javascript">
    jQuery(document).ready(function(){
        // Mac OS detection
        if (/Mac[\/\s](\d+\.\d+)/.test(navigator.platform)) {
            /* for top navigation */
            jQuery("#menu ul, #menu li").css("-webkit-transform", "translateZ(0)");
            jQuery(" #menu li").hover( function() {
                    jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400); }, 
                function() { 
                    jQuery(this).find('ul:first').css({visibility: "hidden"}); 
                });

            jQuery(" #menu2 li").hover( function() {
                    jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400); }, 
                function() {
                    jQuery(this).find('ul:first').css({visibility: "hidden"});
                });
            // Opera Fix
            if (/Opera[\/\s](\d+\.\d+)/.test(navigator.userAgent)){ 
                jQuery(" #menu ul ").css({display: "none"}); 
                jQuery(" #menu2 ul ").css({display: "none"});
            }
        }
    });
</script>

または、優れた javascript session.jsライブラリを使用することもできます ;)
これは、ブラウザの OS 値と、デバイスがタブレット、電話、またはモバイルのいずれであるかを返します。

編集 :すぐに使用できるコードを追加し、w3c 参照を削除します

于 2012-09-16T22:20:51.663 に答える