HELLO guys May peace on you...i am stuck in a problem.i had a loading image that appears while i submit the form but the problem is that my page is not redirect to next page.here is my code please help me....

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script  src="jquery.js"></script>

<script>
$(document).ready(function(){
						   
	
	$('.loader').hide();
	
	$('#test').click(function(){
							   
		$('.loader').show();					   
							   
			return false;				   });
	
});
	
	
	


</script>

<style>

.loader{
	background:url(loading-small.gif) no-repeat;	
	height:32px;
	width: 32px;
	display:inline-block;
}

</style>


</head>

<body>
<form  id="test" action="Untitled-1.php">
<label> Name: </label>
<input type="text" /><br />

<label> Age: </label>
<input type="text" /> <br />

<label><div class="loader"></div></label>
<input type="submit" id="go"/><br /> 
</form>


</body>
</html>

I think you want something like this:

$(document).ready(function(){
  $('.loader').hide();
  $('#test').submit(function(){
    $('.loader').show();					   
    return true;
  });
});

but testing with a fast/local server, .loader may well not show.

A "loading" image is typically only shown for ajax operations, where the page is neither refreshed nor renewed.

There is no harm in what you want but, to stand a chance of being useful, you should preload the image to make sure it is quickly available from browser cache when needed. Otherwise the server would need to respond with the image quicker than with the next page, which is (in general) an unreasonable expectation.

Airshow