jqueryでdivにクラスを変更

Question

jqueryを使用してページ上のユーザーの位置に応じてクラスを変更するdivがあります。この関数は次のようになります。

$(function(){ 

    var menu = $('#menu'), 
     pos = menu.offset(); 

     $(window).scroll(function(){ 
      if($(this).scrollTop() > pos.top+menu.height() && menu.hasClass('default')){ 
       menu.fadeOut('slow', function(){ 
        $(this).removeClass('default').addClass('fixed').fadeIn('slow'); 
       }); 
      } else if($(this).scrollTop() <= pos.top && menu.hasClass('fixed')){ 
       menu.fadeOut('slow', function(){ 
        $(this).removeClass('fixed').addClass('default').fadeIn('slow'); 
       }); 
      } 
     }); 

}); 

また、特殊なクラス/名前のリンク/ボタンをクリックすると、divクラスも変更したいと考えています。

私は悪い試みをしました..しかし、これを前の関数にどのように組み込むことができますか？ ..「それ以外の場合」と

$(".closemeny").click(function() { 
    menu.fadeOut('slow', function(){ 
     $('#menu').removeClass('fixed').addClass('default').fadeIn('slow'); 
}); 

Answer 1

私は全く理解していないが、私は亀裂を取るよ：

ただ、別の.click機能を維持するか、あなたの場合/他の{}に移動します's。あなたは何ができるか

$(function(){  
    var menu = $('#menu'), 
     pos = menu.offset(); 

    $(window).scroll(function(){ 
     if($(this).scrollTop() > pos.top+menu.height() && menu.hasClass('default')){ 
      menu.fadeOut('slow', function(){ 
       $(this).removeClass('default').addClass('fixed').fadeIn('slow'); 
      }); 

      //you can paste it here 

     } else if($(this).scrollTop() <= pos.top && menu.hasClass('fixed')){ 
      menu.fadeOut('slow', function(){ 
       $(this).removeClass('fixed').addClass('default').fadeIn('slow'); 
      }); 

      //or you can paste it here 
     } 
    }); 

    //or you can leave it here to apply to all cases 
    $(".closemeny").click(function() { 
     menu.fadeOut('slow', function(){ 
      $('#menu').removeClass('fixed').addClass('default').fadeIn('slow'); 
     }); 
    }); 
}); 

Answer 2

はちょうどあなたがDRY物事を保つために周りに渡すことができる便利な機能を作成することです。私はあなたがそれらの出来事を組み合わせることに利益をもたらすとは思わない。彼らは同じことをしても彼らは異なっています。

var changeClass = function (c1, c2) { 
    menu.fadeOut('slow', function() { 
     $(this).removeClass(c1).addClass(c2).fadeIn('slow'); 
    }); 
}; 

$(window).scroll(function() { 
    if ($(this).scrollTop() > pos.top + menu.height()) { 
     changeClass('default', 'fixed'); 
    } else if ($(this).scrollTop() <= pos.top) { 
     changeClass('fixed', 'default'); 
    } 
}); 

$(".closemeny").click(function() { 
    changeClass('fixed', 'default'); 
});