If including a library is overkill here is a solution that is guaranteed to work.
$('div').click(function() {
$(this).css('background-color','#FFFFCC');
setTimeout(function() { $(this).fadeOut('slow').fadeIn('slow'); } , 1000);
setTimeout(function() { $(this).css('background-color','#FFFFFF'); } , 1000);
});
- Setup event trigger
Setup event trigger
- Set the background color of block element
Set the background color of block element
- Inside setTimeout use fadeOut and fadeIn to create a little animation effect.
Inside setTimeout use fadeOut and fadeIn to create a little animation effect.
- Inside second setTimeout reset default background color
Inside second setTimeout reset default background color
Tested in a few browsers and it works nicely.
Tested in a few browsers and it works nicely.