Substituir uma imagem utilizando JQuery

Front-end
#1

Pessoal estou com uma dificuldade, quero substituir uma imagem por outra depois de um determinado tempo, a imagem que quero que seja substituída se encontra no css (isso é uma restrição), eu sei que poderia fazer isso facilmente pegando do src na minha tag, mas preciso fazer com css.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>	
	<title>imagem</title>
	
	<style type="text/css" media="screen">
		#loader {
			min-height: 500px;
		}
		.loading {
			background: url(_imgs/loadingAnimation.gif) center center no-repeat;
		}
		
	</style>
	
	<script src="../../_inc/jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" charset="utf-8">
		var img = new Image();
		$(function(){
		});
	</script>
	
</head>

<body>
	
	<div id="loader" class="loading"></div>

</body>
</html>
#2

Não sei se é bem isso que você tá precisando, mas você pode tentar usar o animations do CSS 3. Dá uma olhada nesse link e vê se te ajuda:

http://www.w3schools.com/css3/css3_animations.asp

#3