How can I get an image to move across the browser horizontally from right to left?
<p>I have successfully made fish1 and fish2 move across the screen, but i am having a hard time figuring out how to get fish3 to move from right to left. Seeing how its facing to the left, I don't want it to swim backwards. Any help or advice is greatly appreciated!</p>

<pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head&gt;

&lt;title&gt;Fish Tanks&lt;/title&gt;

&lt;script type="text/javascript"&gt;
&lt;!-- HIDE FROM INCOMPATIBLE BROWSERS
var fish1Position = 0;
var fish2Position = 0;
var fish3Position = 99;
var horizontal = [];
var fillPosition = 10;
var num = 100;
for(var i = 0; i &lt; 100; ++i) {
        horizontal[i] = fillPosition;
        fillPosition += 10;
}

function fish1Swim() {
        document.getElementById("fish1").style.left = horizontal[fish1Position] + "px";
        ++fish1Position;
        if (fish1Position == num) {
                fish1Position = 0;
}
var tim1 = setTimeout(fish1Swim, 100);
}
function fish2Swim(){
        document.getElementById("fish2").style.left = horizontal[fish2Position] + "px";
         ++fish2Position;
         if (fish2Position == num) {
                 fish2Position = 0;
}
var tim2 = setTimeout(fish2Swim, 200);
}

function fish3Swim() {
     document.getElementById("fish3").style.left = horizontal[fish3Position] + "px";
     ++fish3Position;
     if (fish3Position == num) {
fish3Position = 99;
}
var tim3 = setTimeout(fish3Swim, 300);
}

function startSwimming() {
        fish1Swim();
        fish2Swim();
        fish3Swim();
}

// STOP HIDING FROM INCOMPATIBLE BROWSERS --&gt;
&lt;/script&gt;
&lt;/head&gt;
&lt;body onload="startSwimming();"&gt;
&lt;p&gt;&lt;span id="fish1" style="position:absolute; left:10px; top:10px"&gt;&lt;img src="fish1.gif" alt="Image of a fish" /&gt;&lt;/span&gt;&lt;/p&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;p&gt;&lt;span id="fish3" style="position:absolute; left:10px; top:100px"&gt;&lt;img src="fish3.gif" alt="Image of a fish" /&gt;&lt;/span&gt;&lt;/p&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;p&gt;&lt;span id="fish2" style="position:absolute; left:10px; top 150px"&gt;&lt;img src="fish2.gif" alt="Image of a fish" /&gt;&lt;/span&gt;&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>
