Animating an image on a static background help

Animating an image on a static background help

I am trying to create an animation on top of a static background image. I have the animation working properly and correctly but i can't seem to wrap my head around how to get it where i need it to be.

I want the image to be placed document.image[4].src as its animating in order to be in the correct position on the webpage.

Any input would be greatly appreciated, rather new to this.

Animating Code portion in <head>
  1. <script type="text/javascript">
  2. function slideSwitch() {
  3.     var $active = $('#slideshow IMG.active');
  4.     if ( $active.length == 0 ) $active = $('#slideshow IMG:last');
  5.     // use this to pull the images in the order they appear in the markup
  6.     var $next =  $active.next().length ? $active.next()
  7.         : $('#slideshow IMG:first');
  8.     $active.addClass('last-active');
  9.     $next.css({opacity: 0.0})
  10.         .addClass('active')
  11.         .animate({opacity: 1.0}, 1, function() {
  12.             $active.removeClass('active last-active');
  13.         });
  14. }
  15. $(function() {
  16.     setInterval( "slideSwitch()", 75 );
  17. });
  18. </script>


Code portion in <body>
  1. <div id="slideshow">
  2.     <img src="images/car0.gif" alt="Image 0" class="active" />
  3.     <img src="images/car1.gif" alt="Image 1" />
  4.     <img src="images/car2.gif" alt="Image 2" />
  5.     <img src="images/car3.gif" alt="Image 3" />
  6.     <img src="images/car4.gif" alt="Image 4" />
  7.     <img src="images/car5.gif" alt="Image 5" />
  8.     <img src="images/car6.gif" alt="Image 6" />
  9.     <img src="images/car7.gif" alt="Image 7" />
  10.     <img src="images/car8.gif" alt="Image 8" />
  11.     <img src="images/car9.gif" alt="Image 9" />
  12.     <img src="images/car10.gif" alt="Image 10" />
  13.       </div>