Preloaded sldeshow

[judeabb]

1) Script Title: Preloaded Slideshow

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...eloadslide.htm

3) Describe problem: I want to replace the buttons in this script with my own images. Whenever I try and do this the slideshow images disappear. At the moment the page in question has the (ugly but functional) buttons. The images I want to use are in a folder called "images" and the images in the slideshow are in a different folder.
This is the page in question: http://www.caseyorr.com/new/wool2.html

Thanks.

Jude

[jscheuer1]

From Step 2 on the demo page:

<form name="SlideShow">
<table>
<tr>
   <td colspan=2><img name="Screen" width=108 height=135></td>
</tr>
<tr>
   <td><input type="button" name="Previous" 
value="*<<*"
onClick="ShowSlide(-1)"></td>
   <td align="right"><input type="button" name="Next"
value="*>>*" onClick="ShowSlide(1)"></td>
</table>
</form>

Change it to (you will need to supply the path and filename for the next/previous images as indicated in the green areas):

<form name="SlideShow">
<table>
<tr>
   <td colspan=2><img name="Screen" width=108 height=135></td>
</tr>
<tr>
   <td><input type="image" name="Previous" 
src="path and filename of your previous image"
onClick="ShowSlide(-1)"></td>
   <td align="right"><input type="image" name="Next"
src="path and filename of your next image" onClick="ShowSlide(1)"></td>
</table>
</form>

For example, where I have:

path and filename of your previous image

you could put something like:

images/prev.gif

The src attribute of an image input tag works exactly the same as the src attribute of an ordinary img tag.

[judeabb]

I've tried that but then I get no slideshow images at all, just an empty box.
Have a look, I've just done as you suggested:

http://www.caseyorr.com/new/wool2.html

[jscheuer1]

Very strange, the browser no longer recognises the inputs as elements in the form. I think it should, but perhaps inputs of the type image are not considered form elements. In any case, removing this bit of code:

      // THIS WILL DISABLE THE BUTTONS (IE-ONLY)
      document.SlideShow.Previous.disabled = (NextSlide == 0);
      document.SlideShow.Next.disabled = (NextSlide == 
(Slides.length-1));

Will fix it. But the buttons will no longer be disabled when they cannot be used. And the form will submit when you click the next image, even though it isn't seen as an element in the form?!! To fix that, use:

<form action="#" name="SlideShow" onsubmit="return false;">
<table>
<tr>
   <td colspan=2><img name="Screen" width=450 height=450></td>
</tr>
<tr>
								<td><input type="image" name="Previous" src="images/arrowlft.gif"
 onclick="ShowSlide(-1);return false;"></td>
   <td align="right"><input type="image" name="Next" src="images/arrowrt.gif"
 onclick="ShowSlide(1);return false;"></td>
							
								
							
</table>
</form>

You might want to try The Swiss Army Slide Show instead:

http://www.dynamicdrive.com/dynamici...army/index.htm

[judeabb]

Thanks a million - it appears to work now!
I will check out the Swiss Army script too.

Jude