1

特定の高さに到達したときにスティッキー メニューをフェードインする次のコードを取得し、ディスプレイを変更してモバイル ビュー (またはさらに優れたモバイル デバイス) から常に表示できるようにしたい: none; 表示する: ブロック;

この問題は、ユーザーが幅 768 ピクセル未満のデバイスから初めて参加したときに発生し、下にスクロールするまでメニューが表示されません。

私は次のコードを使用しています:

HTML

<nav id="menufijo" style="display:none;" class="navbar navbar-default navbar-fixed-top">

// Everything that's inside

</nav>

ジャバスクリプト

<script>
        $(window).scroll(function(){
        var y = $(window).scrollTop();
        var z = $(".top-header")
        if(y > z.outerHeight() ){
          $("#menufijo").fadeIn("slow");
         } else if (window.matchMedia("(max-width: 768px)").matches) {
          $("#menufijo").style.display = "block";
        } else {
          $("#menufijo").fadeOut("fast");
        }});
</script>
4

1 に答える 1

1

Try:

$(window).scroll(function(){
    var y = $(window).scrollTop();
    var z = $(".top-header")
    if (!window.matchMedia("(max-width: 768px)").matches) {
        if (y > z.outerHeight() ) {
            $("#menufijo").fadeIn("slow");
        } else {
            $("#menufijo").fadeOut("fast");
        }
    }
});
$(function() {
    if (window.matchMedia("(max-width: 768px)").matches) {
        $("#menufijo").show();
    }
});
于 2015-12-28T11:27:45.160 に答える