specific image in javascript popup

[surrealillusions]

Hi,

I've been trying (without sucess) to try and get a javascript popup to display an image. However, the tricky bit, is that i use php to generate the display of the thumbnails, and therefore the links to the bigger image size. I need to use a javascript popup as I want to include other information about that image, that is stored in a txt file.

Is there any specific bit of code i need to put in the popup to display the image that the user clicked on?

Or any alternatives that i could use?

[WesleyC]

If you're talking about the Javascript alert()/confirm()/prompt() functions, you can't display images in these.

However, you can use Javascript's window.open() method to open a popup window with an HTML page in it in the same way as a visitor would see it if navigating directly to it:

window.open("myphpscript.php","WindowID",
"menubar=no,width=430,height=360,toolbar=no");

Then build myphpscript.php so that it displays as desired in a normal browser window, and call the window.open() method as demonstrated when you want to open a popup window with the contents of that page.

Just be aware, many browsers block popups created in this way.

[surrealillusions]

many browsers block popups created in this way.

Thats one of my main concerns, hence the question about any realistic alternatives to this...

As I want to display information about the image, I cant really link straight to the image, unless theres a way of displaying the information in text over the image..

[PHP_Chimp]

There are a load of php image [ca.php.net] functions. So you may be able to write the information over the top of the image.

Could you not use php to build your thumbnail then link to another page that is generated with all of your additional information. You could then use both javascript or the normal link to access the same information.

<a href="more_info.php" onclick="return popup(this, 'more info')">More Info</a>

The Javascript

function popup(mylink, windowname) {
if (! window.focus)return true;
var href;
if (typeof(mylink) == 'string') {
 href=mylink;
}
else {
 href=mylink.href;
window.open(href, windowname, 'width=500,height=200,scrollbars=yes,resizable=yes');
return false;
}
}

This will guarantee that the link will open, either through a popup window or just through the normal hyperlink.