Jquery-Fade Images

Jquery-Fade Images

<HTML>
<head>
<link href="style.css" type"text/css" rel = "stylesheet">
<script type="text/javascript" src="jquery.js" ></script>
<script type="text/javascript">
function Myimage()
{
$(".image #1").show("fade",500);
}
</script>
</head>
<body onload="Myimage();">
<div class="image">
<img id="1" src="b.jpg" border="0" width="100px" height="150px">
<img id="2" src="e.jpg" border="0" width="100px" height="150px">
<img id="3" src="f.jpg" border="0" width="100px" height="150px">
</div>
</body>
</html>

Output: i only can see b.jpg on my broswer.(no fade in, no loading images)
What i wanted is, loading img first appears then b.jpg should slowly fade in . Here in class image, i have added background-image of loading img gif.
please help me out.

Thanks,
Prabin