If I understand you, then the image map should have nothing to do with it. Just the JavaScript events associated with it. I don't know anything about image maps so excuse me if I'm incorrect, is the image map contained within the <img> tag? If so then it can be changed with JavaScript.
EDIT: What I mean is, you can edit where the click able areas are. And even if they aren't it should still be able to be changed. I could probably make something, next time you reply please include all the code (JavaScript, HTML, CSS w.e.).
TimFA,
Hey thanks for the quick response to my post and thank you for offering your help. I really do not have any code to go by. I have been searching the net for something like this. I really do not know anything about coding with javascript. I just would like a script like this, because it would add a cool effect to my site.
the slideshow script like something I would want is like preloaded slide show script found under image effects here at dynamic drive. I have added the code below:
For Head of HTML:
<script language="JavaScript">
//Preloaded slideshow script- By Jason Moon
//For this script and more
//Visit http://www.dynamicdrive.com
// PUT THE URL'S OF YOUR IMAGES INTO THIS ARRAY...
var Slides = new Array('image1.gif','image2.gif','image3.gif');
// DO NOT EDIT BELOW THIS LINE!
function CacheImage(ImageSource) { // TURNS THE STRING INTO AN IMAGE OBJECT
var ImageObject = new Image();
ImageObject.src = ImageSource;
return ImageObject;
}
function ShowSlide(Direction) {
if (SlideReady) {
NextSlide = CurrentSlide + Direction;
// THIS WILL DISABLE THE BUTTONS (IE-ONLY)
document.SlideShow.Previous.disabled = (NextSlide == 0);
document.SlideShow.Next.disabled = (NextSlide ==
(Slides.length-1));
if ((NextSlide >= 0) && (NextSlide < Slides.length)) {
document.images['Screen'].src = Slides[NextSlide].src;
CurrentSlide = NextSlide++;
Message = 'Picture ' + (CurrentSlide+1) + ' of ' +
Slides.length;
self.defaultStatus = Message;
if (Direction == 1) CacheNextSlide();
}
return true;
}
}
function Download() {
if (Slides[NextSlide].complete) {
SlideReady = true;
self.defaultStatus = Message;
}
else setTimeout("Download()", 100); // CHECKS DOWNLOAD STATUS EVERY 100 MS
return true;
}
function CacheNextSlide() {
if ((NextSlide < Slides.length) && (typeof Slides[NextSlide] ==
'string'))
{ // ONLY CACHES THE IMAGES ONCE
SlideReady = false;
self.defaultStatus = 'Downloading next picture...';
Slides[NextSlide] = CacheImage(Slides[NextSlide]);
Download();
}
return true;
}
function StartSlideShow() {
CurrentSlide = -1;
Slides[0] = CacheImage(Slides[0]);
SlideReady = true;
ShowSlide(1);
}
</script>
For the Body of the HTML:
<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>
For the Body Tag of the HTML:
<body onLoad="StartSlideShow()">
The one thing that I am not sure on is how to get the image areas click able like an image map. I need the content to display below the slide show, like in an iframe. I have made a list of somethings that I would like the script to include:
to be able to set the size of the slideshow for images, possibly different sizes (I don't know the size that it is going to be yet)
To have an iframe type feature below the slideshow (like mentioned above)
To be able to set the width and height of the iframe type feature
To be able to add buttons below the slideshow for clicking forwards and back. I can make the images instead of the form buttons. I just need you to tell me where I have to put the address for what images and to have them spaced out the width of the slide show.
Clickable areas in the mage like an image map
How to setup the clickable areas for the data below the slide show
The reason that I don't have the sizes or the html data for the information below the slide show is because, I have not strated this yet. I am trying to get the a script or a script developed so that I can see if this is actually possible.
Thanks again for your help!
Chris