[解決済み] jQuery Animate - ボーダーの色と幅

質問

の画像にボーダーを付けるためのjQueryアニメーションがうまくいきません。 mouseenter :

<div>
    <img src="http://25.media.tumblr.com/acc96259d6b2678985052c33e05a3062/tumblr_mkv9fhDBDS1rmc58qo1_500.jpg" />
</div>

jQuery

$('div img').mousenter(function(){
    $(this).css({"border": "0px solid #f37736"}).animate({
        'borderWidth': '4px',
        'borderColor: '#f37736'
    },500);
}).mouseleave(function(){
     $(this).animate({
        'borderWidth':'0px',
        'borderColor:'#f37736'
    },500);
});

また、jQueryのCSS部分を削除してみましたが、これもうまくいきません。

どうすればいいですか？

$.animate() は、単一の数値を持つCSSプロパティに対してのみ機能します。 によって border-color プロパティは無視されるため、ボーダーの幅だけを指定すればよいことになります。 $.animate() .

その他、イベントは mouseenter はありません。 mousenter .

以下は、修正したコードです。

$('div img').mouseenter(function () {
    $(this).css({border: '0 solid #f37736'}).animate({
        borderWidth: 4
    }, 500);
}).mouseleave(function () {
     $(this).animate({
        borderWidth: 0
    }, 500);
});

デモ