Ciao, voglio evidenziare un colore del bordo della casella di testo per alcuni secondi, in seguito voglio riportarlo al colore bianco. è un modo per la funzione addClass per specificare anche il tempo. ? Qualsiasi altro modo provato con http://jsfiddle.net/RW2s4/7/ non funzionanteevidenzia il colore del bordo della casella di testo per alcuni secondi?
È possibile utilizzare switchClass, qualcosa come:
$("#element").switchClass("removeThisClass", "addThisClass", 1000)
Demo Fiddle: HERE
Riferimento: JQuery Docs
provato con http://jsfiddle.net/RW2s4/7/ non funziona – Rosh
Prova qui http://jsfiddle.net/RW2s4/11/ non hai inserito il segno di spunta nella casella dell'interfaccia utente JQuery a sinistra (sotto menu a discesa jQuery). Ne hai bisogno. Inoltre, fare clic sugli eventi nel markup non funziona in jsfiddle per qualche motivo. L'ho spostato nel JavaScript. Prova questo – mattytommo
@mattytommo - FYI onclick nel markup funziona in jsfiddle, ma non se il tuo javascrip è 'onDomLoad' o' onLoad' dato che sono racchiusi al di fuori dell'ambito della finestra. Basta scegliere 'head (no wrap)' se vuoi eventi normali (che non usi quasi mai con jQuery). Quindi aggiustare quel jsfiddle è facile come selezionare l'interfaccia utente di jQuery e cambiare il menu a discesa: http://jsfiddle.net/RW2s4/14/ – Jamiec
Questo piccolo script aggiunto la classe ' evidenziare "per due secondi nel campo di immissione:
$('#text').change(function() {
var jElement = $(this);
jElement.addClass('highlight');
setTimeout(
function() { jElement.removeClass('highlight'); },
2000
);
});
Vedere anche this example.
Oppure here la combinazione della vostra e mia soluzione.
[Qui] (http://jsfiddle.net/RW2s4/15/) la combinazione della tua e mia soluzione (senza jquery ui). – scessor
vedere dal vivo la funzione animate Demo
$(function(){
setTimeout(ChangeBorder, 2000);
function ChangeBorder() {
$(".highlight").css({"border-color":"red"});
}
});
Controllare jQuery che anima l'elemento dopo un certo intervallo:
demo: 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);
});
});
});
Evidenziare div al click diapositiva per 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>
utilizzare la funzione di effetto
$('#component').effect("highlight", {color: 'red'}, 2000);
Vedi commenti qui sotto per il motivo per cui il vostro non funziona jsfiddle. – Jamiec