Jquery 토글 .CSS가 작동하지 않습니다.

Question

. CSS 속성을 변경하려고합니다. 클릭하면 CSS 전환이 애니메이션으로 바뀝니다. 어떤 이유로이 작동하지 않습니다. 이 작업은 토글해야합니다.

$("button.subnav-toggle").click(function(){    
      $(".subnav").toggle(
      function() { 
       $(".subnav").css({'top':'0'}); 
       alert("something"); 
      }, function() { 
       $(".subnav").css({'top':'-150px'}); 
      }) 
     }); 

Answer 1

이러한 위치로 수업을 전환하는 방법은 무엇입니까?

Answer 2

.toggle 전환을 수행하지 않습니다. 당신은 사용할 수 .animate하지만 :

$("button.subnav-toggle").click(function(){ 
     $(this).animate({top:'-150px'}) 
}); 

수정 :

$("button.subnav-toggle").click(function(){ 

    var top = $(this).css('top'); 
    var topTo = (top == 'auto' || top == '0px') ? '-150px' : '0px'; 
    $(this).css('top', topTo) 
}); 

여기 바이올린 : http://jsfiddle.net/mhfaust/K5hEb/

Answer 3

$(document).ready(function() { 
    $('button.subnav-toggle').click(function() { 
     var visible = $('.subnav').is(":visible"); 
     $('.subnav').slideToggle(500); 
     if (!visible) { 
      $('html, body').animate({ 
       scrollTop: $('.subnav').offset().top 
      }, 500); 
     } 
    }); 
});