jQueryUIでborderColorをアニメーション化する

Question

私は青いボーダーでハイライトしたい、マウスのところでアニメーションを作り、mouseleaveを使って強調したい一連のdivを持っています。 divをクリックすると、新しいdivがクリックされるまで境界線が保持され、前の選択肢が白い枠線に戻ってアニメーション化されます。次のコードを使用して

、境界がフェードイン、彼らはフェードアウトしていない：

$('div').hover(function(){ 
    if (!$(this).hasClass('sel')) { 
    $(this).stop().animate({borderColor:'#0000ff'}, 2000);  
    } 
},function(){ 
    if (!$(this).hasClass('sel')) { 
    $(this).stop().animate({borderColor:'#ffffff'}, 2000); 
    } 
}).click(function(e){ 
    $('.sel').not(this).stop().animate({borderColor:'#ffffff'}, 2000).removeClass('sel'); 
    $(this).addClass('sel'); 
}); 

http://jsfiddle.net/reEsa/

Answer 1

国境が白い最初に行くように見えるし、指定に変更色に直接行くのではなく、色を使用します。 jQueryにまだバグレポートがない場合は、バグレポートを提出してください。

divをdiv内に配置し、境界線をシミュレートするためにパディング4を作成する回避策を行いました。親divに白い背景を与え、親divの背景色をアニメーション化しました。私は問題の場合を示すためにクリックを取り除いた。

jsfiddle here

私はあなたがこのプラグインは、あなたが実際にそれを適用しているとき、それが簡単にコーディングして読むことを作るために作成する新しいdiv要素にそれを呼び出すのdivを追加し、短い少しjQueryプラグイン、でこれをラップします。

ご不明な点がありましたらお知らせください。お返事をお送りいたします。