HOVER EFFECTS WITH CSS TRANSITIONS during loading page

Question

I'm trying to solve problem effects during the loading the page. please take look at the sample at

http://www.ajaxshake.com/plugin/EN/1097/6c9bfe29/circle-effects-with-css3-circleeffects.html

And go to demo 6 as you can see when mouse over on images it will flip down and flip up when mouse out.

I'm trying to figure out how this write code in jquery when loading page and auto flip down images during loading the page without mouseover!

Does anyone have any idea how to write that code, i just done in sample jquery code but still not working please take look at

Answer 1

Try using the jquery...

$(document).ready(function() {
    if($('#your_img_id').is(':hover')) {
        $('#your_img_id').fadeIn('fast');
    }
    else {
        $('#your_img_id').fadeOut('fast');
    }
});

Might work...

if you want it without mouseover... just remove the if condition and check for on load condition...