Forum Moderators: coopster
I just figured out how to dynamically load an image into a popup window, using <img src="<? echo $pic?>.jpg">
Obviously, I'm brand new to PHP =)
This is called from a bit of javascript, which passes the image name to the PHP page. The javascript popup function also requires size declarations for the new window.
What I'd like to do now is have the image size be determined automatically, which will size the window appropriately. Additionally, I am loading the image into a page w/ CSS, so there is some styling and other content in the window. Thus, I will need to have some padding around the image.
My guess is that I will need to have an intermediate page which reads the image size and passes those params onto the new window upon generation.
Any references, suggestions, tips, etc are greatly appreciated!
Thanks =)
For the padding around the image, just create a class or id for the image and put margins on it in the style sheet.
I haven't had time to try this yet, but I think my approach is going to be placing the getimagesize() method in a redirect page, and pass that into a javascript function via through the URL... essentially, I'll have to retrieve the value, split it into two variables (don't know how the method is set up, yet), and pass that into a JS link which calls the image-loading page.
Hopefully, I can get to this tomorrow night.
Thanks very much =)
I am not sure about a redirect in a popup. I would definitely close the popup before the redirect.
Use getimagesize() at the top of your script and get the variables ($width and $height). Then, type a javascript resize command in the <body> tag using onload. This should do.
An alternative to the getimagesize() is to implement a small database with the picture name, the alt, the width and the height (url, description, etc...) and just do a query to get the image size and width and do the same (body tag)
My only concern is that I have multiple sizes of the same image, and generating thumbnails with something like ImageMagik (sp?) would cause a lot of ugliness on the page... Otherwise, I am guessing that I'd have to hard-code each image's name into the script.
I'm at work right now, so don't have an opportunity to play with this - as soon as I get home, I'll give it a go.
I've gotten the PHP into my javascript, and have started to figure out how to use the same variables to dynamically call each image (the size is part of the image name).
Next, I'm working on doing a little math on the variables to give the window some room for the CSS padding and other content.
I really appreciate the help, gang!
here's what I ended up with for the javascript call (I'll continue to tweak this so I can more globally apply it through the gallery):
<?php
list($width, $height, $type, $attr) = getimagesize("../images/wallpapers/sunset01_800x600.jpg");
echo "<a href=\"javascript:popup('picHolder.php?pic=sunset01_800x600', $width+16, $height+125);\">800 x 600</a><br>";
?>What I don't understand is that the getimagesize() method seems to ignore the base HREF declaration in my head tag, but the echo picks it up just fine. I guess more correctly the browser recognizes the relative URL when the javascript calls it... any thoughts on that one?
