Question

I know this has been asked quite a bit , but I need to as simply as possible show a loading image before the content is loaded, exactly how Facebook’s signup form is and many other sites.

    $("#signUpPanel").click(function(){
      $("#headInner").html("<img class='spinner' src='imgs/spinner.gif'>");
        $("#headInner").load("signUp.php");
 });

This is what I have thus far and it displays, but its nearly impossible to even see it. I was thinking of using the delay() function or something similiar, thanks in advance and keep it as simple as possible if you can.

Answer 1

$("#signUpPanel").click(function(){
  $("#headInner").html("<img class='spinner' src='imgs/spinner.gif'>");
  setTimeout(function(){$("#headInner").load("signUp.php");},1000);  
 });