Mou
Mou

Reputation: 16312

How to do the color animation like stackoverflow

Here is one link which play the color animation

Link

Even i need some kind of fade-in and fade-out color animation with jQuery. I want when user click a button then my div will fade similar like stackoverflow.

I tried this way but i guess my effect is close to stackoverflow but not same. here is my code which i tried with CSS

$(window).bind( 'hashchange', function( event ){
        var hash = '#'+event.fragment;
        var originalcolor = $(hash).css('background-color');
        $(hash).css('background-color', 'yellow');
        setTimeout(function () {
          $(hash).css('background-color', originalcolor);
        }, 1500);

  });

Upvotes: 2

Views: 102

Answers (1)

kizisoft
kizisoft

Reputation: 386

You can use jquery.animate():

var $myElement = $('#myElement');
$myElement.animate({'background-color': '#F4AC01'}, 1000, function () {
    $myElement.animate({'background-color': '#fff'}, 1000, function () {
        console.log('Animation finish!')
    })
});

Upvotes: 1

Related Questions