jQuery의 애니메이션이 작동하지 않습니다.

Question

버튼을 가리키면 배경색이 변경되지 않습니다.

내 jQuery를 :

<script type="text/javascript" src="/js/jquery.js"></script> 
<script language="javascript" type="text/javascript"> 
$(document).ready(function(){ 
    $(".reject").hover(function() { 
     $(this).animate({background: '#000'}, 1000); 
    }, function(){ 
     $(this).animate({background: '#333'}, 1000); 
    }); 
}); 
</script> 
<style type="text/css"> 
    .reject{padding:10px;font-size:20px;background:#F00;} 
</style> 

내 HTML :

<button class="reject">Reject</button> 

나는 무엇을 놓치고? JSFiddle

당신은 jQuery를 UI를 포함하고 다음 jQuery 코드를 사용해야합니다 :

Answer 1

답변 this
Check this online demo

<script type="text/javascript" src="/js/jquery.js"></script> 
//Add this script 
<script src="http://www.bitstorm.org/jquery/color-animation/jquery.animate-colors.js"></script> 
<script language="javascript" type="text/javascript"> 
$(document).ready(function(){ 
    $(".reject").hover(function() { 
     $(this).animate({backgroundColor: '#000'}, 1000); 
    }, function(){ 
     $(this).animate({backgroundColor: '#333'}, 1000); 
    }); 
}); 
</script> 
<style type="text/css"> 
    .reject{padding:10px;font-size:20px;background:#F00;} 
</style> 

HTML 코드

<button class="reject">Reject</button> 

Answer 2

여기에 작업이있는 JSfiddle입니다.

$(document).ready(function(){ 
    $(".reject").hover(function() { 
     // Stop the previous animation (if any) and then animate 
     $(this).stop().animate({backgroundColor: '#000'}, 1000); 
    }, function(){ 
     // Stop the previous animation (if any) and then animate 
     $(this).stop().animate({backgroundColor: '#FFF'}, 1000); 
    }); 
}); 

코드가 좋았습니다. jQuery UI를 포함시켜야합니다. 그러나 정지 기능을 사용하는 것이 가장 좋습니다.