How to link to specific images in a Javascript slideshow

J

Jeannie

I have a popup window which is a slideshow of about 7 images. When the
popup window loads, the first image is present and then the viewer can
select next or previous to scroll through the rest of the images.

I'd like to use the same popup window at different points throughout
the website and have the Virtual Tour (slideshow) open up at the
appropriate photos. Meaning I'd like to control which picture the
popup window opens up to, depending on where the user is in the site.

Does anyone know where I can find code that does this? I am somewhat
familiar with Javascript but would like to find some ready-made code
which accomplishes this.

Thanks for all help and suggestions!!

--JAG
 
R

Reply Via Newsgroup

Jeannie said:
I have a popup window which is a slideshow of about 7 images. When the
popup window loads, the first image is present and then the viewer can
select next or previous to scroll through the rest of the images.

I'd like to use the same popup window at different points throughout
the website and have the Virtual Tour (slideshow) open up at the
appropriate photos. Meaning I'd like to control which picture the
popup window opens up to, depending on where the user is in the site.

Does anyone know where I can find code that does this? I am somewhat
familiar with Javascript but would like to find some ready-made code
which accomplishes this.

Thanks for all help and suggestions!!

--JAG

I don't know about ready made code - however it shouldn't prove to
difficult to come up with some sort of a solution since you already have
some javascript skills. There are a couple of things you might already
know, but you've not connected them...

First, when you open your popup window with window.open, you give the
popup window a name... If you use the same window name as a target in
any of your other pages, it will update the popup window - And if its
not already open (perhaps the user closed it) then a new one will open.

The only problem that I could forsee is that you might want a popup that
is larger then the one opened in an earlier window in which case you
might have to resize it (which I believe is possible on most recent
popular browsers but I've never written code for it).

Does that help you any, or do you still need some code? In my early days
of learning javascript I used to examine some of the code at
javascript.internet.com however not all of it is environmentally
friendly (in such that it may be unclean code, achieveing results that
could be achieved with less resources using alternative methods).
Still, its helps me along... maybe you might find what you're looking
for there.

randelld
 
J

Jeannie

Thanks - though I wasn't able to quite come up with a solution yet. I
am putting my code here, maybe that will help. If anyone can make
suggestions on how to alter it, that would be much appreciated!

Here's the code for the popup slideshow I have now which currently is
running.
***********************************************
<html>
<head>
<script language="JavaScript">
<!--
var interval = 30000;
var random_display = 0;
var imageDir = "images/";

var imageNum = 0;
imageArray = new Array();
imageArray[imageNum++] = new imageItem(imageDir +
"im_pop_airplane.jpg");
imageArray[imageNum++] = new imageItem(imageDir +
"im_pop_airplane.jpg");
imageArray[imageNum++] = new imageItem(imageDir +
"im_pop_humidor.jpg");
imageArray[imageNum++] = new imageItem(imageDir +
"im_pop_humidor2.jpg");
imageArray[imageNum++] = new imageItem(imageDir +
"im_pop_lounge1.jpg");
imageArray[imageNum++] = new imageItem(imageDir +
"im_pop_lounge2.jpg");
imageArray[imageNum++] = new imageItem(imageDir + "im_pop_udr.jpg");
imageArray[imageNum++] = new imageItem(imageDir +
"im_pop_winecel.jpg");

var totalImages = imageArray.length;

function imageItem(image_location) {
this.image_item = new Image();
this.image_item.src = image_location;
}
function get_ImageItemLocation(imageObj) {
return(imageObj.image_item.src)
}

function randNum(x, y) {
var range = y - x + 1;
return Math.floor(Math.random() * range) + x;
}
function getNextImage() {
if (random_display) {
imageNum = randNum(0, totalImages-1);
}
else {
imageNum = (imageNum+1) % totalImages;
}

var new_image = get_ImageItemLocation(imageArray[imageNum]);
return(new_image);
}

function getPrevImage() {
imageNum = (imageNum-1) % totalImages;
var new_image = get_ImageItemLocation(imageArray[imageNum]);
return(new_image);
}

function prevImage(place) {
var new_image = getPrevImage();
document[place].src = new_image;
}

function switchImage(place) {
var new_image = getNextImage();
document[place].src = new_image;
var recur_call = "switchImage('"+place+"')";
timerID = setTimeout(recur_call, interval);
}
// -->
</script>
</head>
<body>
<table>
<tr>
<td><img src="images/im_pop_airplane.jpg" width="442" height="288"
alt="" border="0" img name="slideImg"></td>
</tr>
<tr>
<td class="closelink"><a href="#" onClick="prevImage('slideImg');
clearTimeout(timerID)" class="closelink"> &lt;&lt;previous</a> </td>
<td></td>
<td align="right" class="closelink"><a href="#"
onClick="switchImage('slideImg'); clearTimeout(timerID)"
class="closelink">next&gt;&gt; </a></td>
</tr>
<tr>
</table>
</body>
</html>
***********************************************************

The code above is the actual slideshow code which runs in a popup
window. I want to be able to call up the slideshow popup from other
pages in my website, but have it start at an image I specify.

For instance, on one page, I use this code to call up the slideshow
popup:
<a href="javascript:popUp('banquet_tour.html')"><img
src="images/bt_bd_pic2.jpg" width="234" height="153" alt=""
border="0"></a>

It always defaults to the first popup in the array. How can I ask it
to start with a different specific image in the array?
***********************************************
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,768
Messages
2,569,574
Members
45,051
Latest member
CarleyMcCr

Latest Threads

Top