Question

The following java-script is working fine (Jquery)

$(document).ready(function(){
$('#c_area').load($('.m_top:first').attr('href'))   
});
$('.m_top').click( function(){
$("#myDiv").html('<img src="images/loading.gif" alt="Wait" />');
var name= $(this).attr('href');
$('#c_area').hide().load(name).fadeIn('normal');                
$("#myDiv").html('');
return false;
});

I want to show the loading image (spinner) for 2 seconds minimum, because when page has already loaded, while click again on link, loading image (spinner) not display again because the page already loaded.

minimum time = 2 second

maximum time = until the contents loaded

Answer 1

Use delay(). Give the number of seconds in milliseconds like

$('#c_area').delay(2000).hide().load(name).fadeIn('normal');   
            //^ delay for 2 sec then hide      

Here is your solution.

I used the setTimeout() to trigger the function after 2 seconds.

$('.m_top').click( function(){          

    var name= $(this).attr('href');
    $('#c_area').html('<img src="images/loading.gif" alt="Wait" />');
    setTimeout( function() {
       $("#c_area").hide().load(name).fadeIn("normal");
    },2000);

    $("#myDiv").html('');
    return false;
});