Click to See Complete Forum and Search --> : [RESOLVED] want SIMPLE JS code for 1 popup window loading multiple images


Karla
05-06-2006, 04:56 PM
Building a website with screengrabs. Currently I'm using a JS code that, when a thumb is clicked, a popup with the larger image will appear. (All screengrabs are the same size.)

HOWEVER, clicking on another thumb will open up a *second* popup. (Clicking on a third link opens a third popup, etc.) Not what I want.

This is the code I'm using.
In the head section:

<SCRIPT language="JavaScript">
<!--
function n_window(theurl)
{
// set the width and height
var the_width=470;
var the_height=360;
// set window position
var from_top=240;
var from_left=330;
// attributes put together
var the_atts='width='+the_width+',height='+the_height+',top='+from_top+',screenY='+from_top+',left='+fro m_left+',screenX='+from_left;
// open window
window.open(theurl,'',the_atts);
}
//-->

And in the "body" section, each thumbnail link has this code:

<a href="javascript:n_window('can01.jpg');"><img src="tcan01.jpg" border="0"></a>

I *have* found a JS script being used by another screengrab-based site that actually does what I want to do. That is to say, after the popup, uh, pops up, when I click on a second thumb, the image in that same popup changes to the second image. Yay!. Anyways, here's the code:

In the 'head' section:
<script language="JavaScript">
</script>

Is this even needed? Anyway.

In the body section, each link is thus:
<A href="images/1.jpg" target="blank"
onclick="window.open('images/1.jpg','blank','height=500,width=720,toolbar=no,directories=no,status=no,menubar=no,scrollbars=no,re sizable=yes'); return false;"><IMG src="thumbnails/1.jpg" border="0" alt=1></A>

Now this might sound stupid, but to me, that's a lot of code for just one link. And IMO, the more code you have, the harder it is to find things.

So ultimately, here's my question: Is it possible to have the simplicity of the first code that does the function of the second code? Or am I faced with using the second code in the end? Thoughts, opinions, suggestions?

phpnovice
05-06-2006, 05:00 PM
Change this:

window.open(theurl,'',the_atts);

to this:

window.open(theurl, 'myPopup', the_atts);

Giving the new window a fixed name causes the new window to be reused each time.

Karla
05-06-2006, 06:16 PM
Oh, this works perfectly! Thank you very much! ^_^

phpnovice
05-06-2006, 06:20 PM
You're welcome.

Cheers.

kjvaughn
06-21-2006, 09:59 AM
Is there a way to make the window resize automatically to fit the image? I have a page that this script would work great for, but the photos are not all oriented the same, some are 500x375 and the others are 375x500.
Thanks.




Change this:

window.open(theurl,'',the_atts);

to this:

window.open(theurl, 'myPopup', the_atts);

Giving the new window a fixed name causes the new window to be reused each time.

phpnovice
06-21-2006, 10:38 AM
var the_atts = 'width=512,height=435';
...or...
var the_atts = 'width=387,height=560';