Snap to fit pictures?

  walesrob 17:04 16 Jan 2006
Locked

Hi, I'm trying to get some pictures on a website to display in their own window, BUT not a full sized window.

For example, I have a image gallery, all thumbnailed. When an image is clicked, it will open a full sized version of that image in a new window, BUT the window will fit nicely around the picture, not the window covers the whole screen, with the picture only filling half the screen.

Hope someone can help! Thanks in advance!

  Forum Editor 17:27 16 Jan 2006

which software application you're using to design your site - it will help us to help you.

  walesrob 17:29 16 Jan 2006

Hi, sorry I should have stated...Dreamweaver and I'm using Photoshop to edit the images.

Thanks again!

  walesrob 00:25 30 Jan 2006

Ok, it seems I need some jscript code.

  beynac 07:40 30 Jan 2006

Try this:

The script:
<SCRIPT language=Javascript TYPE="text/javascript">
<!--
function OpenPopup(strFileName)
{
popupWnd=window.open(strFileName,
"PopupWindow",
"toolbar=no,width=400,height=300,directories=no,status=no,scrollbars=no,resize=no,menubar=no");
}
//-->
</SCRIPT>

Use this for your picture link:
<A href="javascript:OpenPopup('picture.jpg');">My Picture</A>

  harristweed 11:22 30 Jan 2006

I designed a site that had thumbnail pictures that opened a larger picture in a new window. The problem I had was that the photos were all different sizes.

I found some java script that open a new window (this got over the problem of popup blockers) and resized the window.

Using PHP to get the image size, I was able to set the window to fit!

The php looks like this
//get picture size
$size = GetImageSize ("path to image here"); // set image name here
$x=$size[0];
$y=$size[1];

then the java

<script language="JavaScript">
<!--
window.resizeTo(<?php echo "$windowx,$windowy";?>)
-->
</script>

if you want to see it live

click here

Hope this helps

  beynac 12:08 30 Jan 2006

Very neat! A better solution if the picture size varies, provided you have php on the web server.

Although my javascript uses the word 'popup' it doesn't get stopped by any popup blockers I've used.

  walesrob 13:08 30 Jan 2006

Beynac, the code is already in use using DW's behaviours component (i.e. on click, no scrollbars, no resize, 500X375 window size, etc) but thanks anyway.

To explain things a bit better, click here and you will see the first 6 images do exactly as I want, whereas the rest generate a degree of white space around image. I've checked the html coding for the first six images, but I can't seem to replicate the behaviour to the remaining images.

I've just inherited this site, and I'm being thrown into the deep-end here!!

Thanks again for all your help.

  walesrob 21:37 30 Jan 2006

Ok, it all makes sense now.

I'll tick this as resolved. Thanks for all your help!

This thread is now locked and can not be replied to.

Elsewhere on IDG sites

Alienware 17 R4 2017 review

These brilliant Lego posters show just what children's imaginations are capable of

Mac power user tips and hidden tricks

Comment réinitialiser votre PC, ordinateur portable ou tablette Windows ?