Slideshow of images

windows

Guest
I have a web page in which I want an image slideshow when the page loads.<br />
<br />
I have the following code:<br />
<br />
<SCRIPT LANGUAGE="JavaScript"><br />
//set image paths<br />
src = <!-- m --><a class="postlink" href="http://www.htmlforums.com/archive/index.php/">http://www.htmlforums.com/archive/index.php/</a><!-- m -->["images/pic1.jpg", "images/pic2.bmp", "images/pic3.jpg"]<br />
<br />
//set duration for each image<br />
duration = 3;<br />
<br />
ads=[]; ct=0;<br />
<br />
function switchAd() {<br />
var n=(ct+1)%src.length;<br />
if (ads[n] && (ads[n].complete || ads <br />
[n].complete==null)) <br />
{document["Ad_Image"].src = <!-- m --><a class="postlink" href="http://www.htmlforums.com/archive/index.php/ads">http://www.htmlforums.com/archive/index.php/ads</a><!-- m --> [ct=n].src;}<br />
ads[n=(ct+1)%src.length] = new Image;<br />
ads[n].src = <!-- m --><a class="postlink" href="http://www.htmlforums.com/archive/index.php/src">http://www.htmlforums.com/archive/index.php/src</a><!-- m -->[n];<br />
setTimeout("switchAd()",duration*1000);}<br />
<br />
function doLink(){<br />
} onload = function(){<br />
if (document.images)<br />
switchAd();}<br />
</SCRIPT><br />
<br />
<A HREF=http://www.htmlforums.com/archive/index.php/"javascript:doLink();" onMouseOut="status=''"><IMG NAME="Ad_Image" SRC=http://www.htmlforums.com/archive/index.php/"images/Pic1.jpg" BORDER=0 width="150" length="120"></A><br />
<br />
This works if the mouse moves over the pic. <br />
How can I change this so that the slideshow begins when the page loads without any mouse interaction.<br />
<br />
Thanks,<br />
Ninel<!--content-->I think, replace:<br />
<br />
<A HREF=http://www.htmlforums.com/archive/index.php/"java script:doLink();" onMouseOut="status=''"><IMG NAME="Ad_Image" SRC=http://www.htmlforums.com/archive/index.php/"images/Pic1.jpg" BORDER=0 width="150" length="120"></A><br />
<br />
with:<br />
<br />
<img name="Ad_Image" src=http://www.htmlforums.com/archive/index.php/"images/Pic1.jpg" border="0" width="150" length="120" alt="slide show"><br />
<br />
<script type="text/javascript"><br />
<!--<br />
doLink();<br />
--><br />
</script><br />
<br />
might be all you need.<br />
<br />
<br />
<br />
Additionally, I usually put the main chunk of code (everything between the original <script> ... </script> tags in your original post [starting with //set image paths and ending with switchAd();} itself], but not the tags themselves) in an external .js file, called using:<br />
<script type="text/javascript" language="javascript" src=http://www.htmlforums.com/archive/index.php/"/path/file.js"></script><br />
<br />
<br />
<br />
Finally. It is best to name files all in lower case, "pic1" is not the same as "Pic1" so you can avoid silly typing errors. There is not a length attribute for the <img> tag. As far as I know only width and height are valid.<!--content-->
 
Back
Top