[thelist] Slide show with html text

Raditha Dissanayake jabber at raditha.com
Sat Oct 11 08:58:03 CDT 2003


May i point you towards SMIL? It's a w3 standard, it's designed for 
slide shows. It's been sitting on the back burners for a while but it's 
making a comeback. most notably on mobile phones where it's used in MMS 
but it's origin is pretty much in the web.

Jono Young wrote:

>I need to make a slide show - containing 3 images with html text captions -
>with an image at the top, and a caption below each image.  I would like to
>pause the slide show for 9 seconds on each image and caption.  I know that
>Javascript is the way to go, I am just not sure how to pull it off.  I have
>successfully created a similar slide show using a graphic for the caption
>using the code below:
>><script language="JavaScript" type="text/JavaScript">
>>var isNS = navigator.appName.indexOf("Netscape")  != -1
>>var isIE = navigator.appName.indexOf("Microsoft") != -1
>>function show() {
>>  if (isNS) document.layers["d1"].visibility = "show";
>>  if (isIE) document.all.d1.style.visibility = "visible";
>>function hide() {
>>  if (isNS) document.layers["d1"].visibility = "hide";
>>  if (isIE) document.all.d1.style.visibility = "hidden";
>>var image1=new Image(); image1.src="images/slide1.jpg";
>>var image2=new Image(); image2.src="images/slide2.jpg";
>>var image3=new Image(); image3.src="images/slide3.jpg";
>>var image4=new Image(); image4.src="images/slide4.jpg";
>>var text1=new Image(); text1.src="images/slide1aol_quote.gif";
>>var text2=new Image(); text2.src="images/slide2aol_quote.gif";
>>var text3=new Image(); text3.src="images/slide3aol_quote.gif";
>>var text4=new Image(); text4.src="images/slide4aol_quote.gif";
>>var step=1;
>>var slide=1;
>>var text=1;
>>function slideit() {
>>    if (!document.images) {
>>        return;
>>    }
>>    document.images.slide.src=eval("image"+step+".src");
>>    document.images.text.src=eval("text"+step+".src");
>>    if (step<4) {
>>        step++;
>>    } else {
>>        step=1;
>>    }
>>    setTimeout("slideit()",5000)
>><body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"
>>onload="slideit();" background="images/bg_1.gif">
>Then, in the page¹s html code, I put name="slide" on the JPG slideshow
>image, and name="text" on the slideshow¹s GIF text image, and the images
>rotated.  Can I do something similar to this, but use html text instead of a
>GIF for the slideshow¹s caption?  Hopefully I am being clear enough here, I
>an pretty new to this.  Thanks in advance!

Raditha Dissanayake.
http://www.radinks.com/sftp/          |  http://www.raditha/megaupload/
Lean and mean Secure FTP applet with  |  Mega Upload - PHP file uploader
Graphical User Inteface. Just 150 KB  |  with progress bar.

More information about the thelist mailing list