javascript - jQueryを使用して単純なスティッキーナビゲーションを構築するにはどうすればよいですか？

Question

スクロール時にdivのcssを変更しようとしています。これは私のコードですが、残念ながら機能しません。

$(document).ready(function() {
   $(window).scroll(function () {
        if ($(this).scrollTop() > 150) {
            $('#subnav').css({
                'position' : 'fixed',
                'top' : '0'
            });
        } else {
            $('#subnav').css({
                'position' : 'static',
                'top' : 'auto'
            });
        }
    });
 });

Answer 1

これを試して：

これがjsFiddleの動作です

$(document).ready(function() {
   $(window).scroll(function() {
       var scrollVal = $(this).scrollTop();
        if ( scrollVal > 150) {
            $('#subnav').css({'position':'fixed','top' :'0px'});
        } else {
            $('#subnav').css({'position':'static','top':'auto'});
        }
    });
 });

注：値が1つしかない場合は使用できますがelse、値が複数ある場合は使用しないことをお勧めします。競合が発生するため、 inteadelseを使用してください。else if