JQuery FadeIn FADEOUT эффект

Question

У меня есть поверочный элемент:

<span id="signInResult" style="border: 1px solid white;">html in here</span> 

когда пожары успеха JQuery Ajax Я хотел бы промежуток немедленно зеленеть, а затем исчезать обратно по умолчанию белого цвета в:

success: function(msg){ 
    $("#signInResult").css('border-style', 'solid'); 
    $("#signInResult").css('border-color', 'green'); 
    $("#signInResult").fadeIn(300).css('border-color', 'white').fadeIn(300); 
} 

Я пробовал несколько вариантов fadeIn и fadeOut .. текущая версия выше ничего не делает .... лучший способ сделать это, чтобы получить результат желания? спасибо

Answer 1

Возможно, вы захотите использовать animate. Он изменяет свойства css, заданные медленно, до заданных значений в течение указанного таймфрейма. FadeIn/FadeOut имеют дело только с opacity и display.

Try:

success:function(msg) { 
    $("#signInResult").css('border-color', '#0f0').animate({'border-color': '#fff'}, 300); 
} 

Docs:

Answer 2

Как отмечает ваш вопрос, который вы хотите изменить цвет границы, для анимации цвета, попробуйте следующее:

http://jsbin.com/anubin/1/edit

$(function() { 
    $("#signInResult").css('border-style', 'solid'); 
    $("#signInResult").css('border-color', 'green'); 
    $("#signInResult").hide().fadeIn(300); 

    $("#signInResult").animate({ 
     borderColor: "white", 
     width: 500 
     }, 1000); 
}); 

jquery ui плагин необходим.