resaltar el color del borde del cuadro de texto por unos segundos?

Question

Hola, quiero resaltar el color del borde de un cuadro de texto durante unos segundos, luego deseo volver a cambiarlo a color blanco. ¿Hay alguna manera de que la función addClass también especifique la hora? ? Cualquier otra manera trató con http://jsfiddle.net/RW2s4/7/ no trabajar

Answer 1

Puede utilizar switchClass, algo así como:

$("#element").switchClass("removeThisClass", "addThisClass", 1000) 

Demostración del violín: HERE

Referencia: JQuery Docs

Answer 2

Este pequeño script agrega la clase ' resalte 'durante dos segundos en el campo de entrada:

$('#text').change(function() { 
    var jElement = $(this); 
    jElement.addClass('highlight'); 
    setTimeout(
     function() { jElement.removeClass('highlight'); }, 
     2000 
    ); 
}); 

Ver también this example.

O here la combinación de su solución y la mía.

Answer 3

ver en directo la función animado Demo

$(function(){ 

    setTimeout(ChangeBorder, 2000); 

    function ChangeBorder() { 
    $(".highlight").css({"border-color":"red"}); 
    } 
}); 

Answer 4

Comprobar jQuery que anima el elemento después de un cierto intervalo:

demo: div http://jsfiddle.net/umSkg/2/

$(document).ready(function(){ 
    var ogColor = $("#inpt").css("border-left-color"); 
    $("#trggr").click(function(){ 
     var inpt = $("#inpt"); 
     var delay = 1000; 
     inpt.animate({ borderColor: "#EAC117" }, delay,function(){ 
     //revert after completing 
     inpt.animate({ borderColor: ogColor }, delay); 
     }); 
    }); 

}); 

Answer 5

Resaltar al hacer clic diapositiva para Div

$('.box').click(function() { 
    var jElement = $(this); 
    jElement.addClass('highlight'); 
    setTimeout(
     function() { jElement.removeClass('highlight'); }, 
     500 
    ); 
    //$(window).scrollTop($('.box3').offset().top,100); 
    $("html, body").delay(100).animate({ 
     scrollTop: $('.box2').offset().top 
    }, 2000); 

}); 


    <button>http://jsfiddle.net/tyPct/198/ </button> 

Answer 6

utiliza la función efecto

$('#component').effect("highlight", {color: 'red'}, 2000);