[Javascript] Re: need script - slideshow with captions

Muchacho, Laurent (TWIi London) LMuchacho at twii.net
Tue Mar 4 07:33:02 CST 2003


Hi 

Sorry to cut everyone short but you all trying to complicate your life with
2 array or trying to store data with this kind of process 
ok everyone thought of the array what is a good thing but you don't need a
seconde one for the caption because if you want to add a alt text to your
image or a link to an other page you will need to create new array and after
a will your code will be completely unmaintainable, What you need is to
store an object in your array 

I built this small examples with all you need this work only on IE but the
logic should drive you in better direction

http://www.elmuchacho.com/examples/slidde_show/default.asp

Laurent 







-----Original Message-----
From: BEKIM BACAJ [mailto:trojani2000 at hotmail.com]
Sent: 01 March 2003 14:21
To: javascript at LaTech.edu
Subject: Re: [Javascript] Re: need script - slideshow with captions


All you need to do is ad another array of caption contents after or before 
the img arrays the same way:

NewCapt = new Array (
"this and that",
"caption contents",
"capiton3",

...until the last img caption and u're done
)

And at this line:

    document.slideshow.src = NewImg[ImgNum];

ad something like:

    caption.innerText = NewCapt[ImgNum];

and inside the HTML before this line:

   <img src="photos/beaders001.jpg" name="slideshow">

add the (in style) formated DIV:

   <DIV ID="caption">The Defalt img caption text</DIV>

And ure done.
Cheers!









>From: Dana Hall <lists at dbeads.net>
>Reply-To: javascript at LaTech.edu
>To: <javascript at LaTech.edu>
>Subject: [Javascript] Re: need script - slideshow with captions
>Date: Fri, 28 Feb 2003 22:44:34 -0800
>
> >Just add an array of captions to the script and change the caption
> >as you change the image?
>
>I know I would need another array, and thank you for helping me with
>the code.  Below is the code from my page, but I'm having difficulty
>with four lines of the code you gave me:
>(1) var document.myImage.src=newimage[n] // whatever it is
>(2) var document.getElementById("caption").innetHTML=NewCap[n]
>
>(3) <img id=myImage src=>
>(4) <div id=caption></div>
>
>
>I know where 3 and 4 go, in the HTML instead of:
><img src="photos/beaders001.jpg" name="slideshow">
>
>but I can't figure out where 1 and 2 go, instead of what, and if
>anything else needs to change.  The original script didn't use a
>fixed array, so I can use any number or pictures and add more at any
>time.  So I wrote the caption array the same.  as long as each has
>the same number of elements it should work.  Can some help out here?
>thanks
>
>-dana
>
>
>************************** begin code *******************************
>
><html>
><head>
>	<title>Texas Beaders</title>
>
><SCRIPT LANGUAGE="JavaScript">
>
><!-- Begin
>NewImg = new Array (
>"photos/beaders001.jpg",
>"photos/beaders002.jpg",
>"photos/room.jpg"
>);
>
>NewCap = new Array(
>"Caption for photo 1",
>"Caption for photo 2",
>"Caption for photo 3"
>);
>
>
>var ImgNum = 0;
>var ImgLength = NewImg.length - 1;
>
>//Time delay between Slides in milliseconds
>var delay = 3000;
>
>var lock = false;
>var run;
>function chgImg(direction) {
>if (document.images) {
>ImgNum = ImgNum + direction;
>if (ImgNum > ImgLength) {
>ImgNum = 0;
>}
>if (ImgNum < 0) {
>ImgNum = ImgLength;
>}
>document.slideshow.src = NewImg[ImgNum];
>    }
>}
>function auto() {
>if (lock == true) {
>lock = false;
>window.clearInterval(run);
>}
>else if (lock == false) {
>lock = true;
>run = setInterval("chgImg(1)", delay);
>    }
>}
>//  End -->
></script>
>
>
><!--#include file="top_of_file.inc" -->
><!--#include file="logo.inc" -->
>
><p>&nbsp;</p>
><p>&nbsp;</p>
><div align="center"><h2><b>Photos from the 4th Annual<br>
>Texas Beaders Bead Retreat</b></h2></div>
>
><p>&nbsp;</p>
><p>&nbsp;</p>
><p>&nbsp;</p>
>
>
><div align="center"><table>
><tr>
><td align="right"><a href="javascript:chgImg(-1)">Previous</a> -
></td>
><td align="center"><a href="javascript:auto()">Auto/Stop</a> - </td>
><td align="left"><a href="javascript:chgImg(1)">Next</a></td>
></tr>
></table>
><p>
><img src="photos/beaders001.jpg" name="slideshow"></div>
>
><!--#include file="bottom_of_file.inc"-->
>
></body>
></html>
>
>_______________________________________________
>Javascript mailing list
>Javascript at LaTech.edu
>https://lists.LaTech.edu/mailman/listinfo/javascript


_________________________________________________________________


_______________________________________________
Javascript mailing list
Javascript at LaTech.edu
https://lists.LaTech.edu/mailman/listinfo/javascript


DISCLAIMER - The preceding e-mail message (including any attachments)
contains information that may be confidential, may be protected by the
attorney-client or other applicable privileges, or may constitute non-public
information.  It is intended to be conveyed only to the designated
recipient(s) named above.  If you are not an intended recipient of this
message, or have otherwise received it in error, please notify the sender by
replying to this message and then delete all copies of it from your computer
system.  Any use, dissemination, distribution, or reproduction of this
message by unintended recipients is not authorized and may be unlawful. The
contents of this communication do not necessarily represent the views of
this company.



More information about the Javascript mailing list