PDA

View Full Version : Javascript popup on click question


Denton
03-24-2006, 06:30 PM
I'd like to create a javascript that will allow me to setup a gallery of pictures that all link to a larger version. What I want to do is code it in a way where when an image is clicked, the larger image is displayed in a popup window which is centered and has a fixed size, such as 500x250.

My javascript is rusty so I'm either looking for a script to do this or preferably, the attributes that are needed to code this script.

Thanks.
Nuke
03-24-2006, 10:23 PM
Check this out:
http://www.web-source.net/javascript_popup_window2.htm
Denton
03-24-2006, 10:41 PM
Thanks. I think this is pretty much exactly what I'm looking for. I wonder if there's a way to use this code for all of my images without having to create seperate functions.
Nuke
03-24-2006, 11:15 PM
Perhaps set the address in to a variable and then just update the variable for each picture?
Denton
03-25-2006, 11:37 AM
I was thinking about how to do this with variables as well but I can't quite figure it out. I was thinking about trying to come up with an If statement that would cycle through the different image names and link it with the variable but I haven't got around to coding this yet.

I will play around with that script today and see if I can do it. Either way, this script is exactly what I needed. Thanks again.
Denton
03-25-2006, 12:04 PM
I've come up with an If Statement but it's not working. Here's the code:

<html>

<head>

<script language="JavaScript">
function image(){
newsurl = "image_003.jpg";

newswin = open(newsurl,"Bulletin","resizable=yes,location=no,scrollbars=no,toolbar=no ,menubar=no,directories=no,height=400,width=270");
}
</script>


<script language="JavaScript">
if(tag == "1"){
newsurl = image_003.jpg" ;
}else if(tag == "2"){
newsurl = image_025.jpg";
} else {
newsurl = image_003.jpg" ;
}
</script>



</head>

<body>

<script language="JavaScript">
tag = "1";
</script>

<a href="javascript:image()">Image</a>

<br><br>

<script "language="JavaScript">
tag = "2";
</script>

<a href="javascript:image()">Image</a>
</body>
</html>

I think the problem is that I'm putting the tag code in the wrong spot. Is there a way to put this code in the link itself? <a href="javascript:image()">Image</a> Possibly in the parenthesis?

edit: After looking at the code I now think that part of the problem is that the variable is being declared within the function.
kibboy
03-28-2006, 09:43 PM
There are a few ways to do this but if you think having the js code in the link will work you could always use this -




<a
href="javascript:open('/images/image1.jpg','Bulletin','resizable=yes,location=no, scrollbars=no,toolbar=no,menubar=no,director
ies=no,height=400,width=270');">
<img src=asdf>
</a>



And yes, the problem is when your function executes you are overiding the previous newsurl value. Remove the newsurl = "image_003.jpg"; from the function and add you are missing starting quotes within your if statements and it should work fine as is.

Kibb