SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    New resized window pop up for image

    hey, im having some trouble. Basically i want a thumbnail to open, when clicked, as the enlarged image in a new window thats resized for it.

    Can anyone help me with a code please? ive tried ones that link to pages with the image on but its not practical with so many thumb nails.

    james

  2. #2
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    If you want the window to have, say, the width of the image +50px and the height of the image +50px, then it gets a bit complicated. It's easy to define a popup window of a particular size:
    Code:
    <a href="#" onclick="window.open('img12.jpg', 'img12', 'toolbar=no,menubar=no,location=no,resizable=yes,scrollbars=no,width=150,height=100');"><img src="thumb12.jpg" /></a>
    This goes into more detail

    If you want the size of the popup to depend on the size of the image automatically, then it looks like this is adequate.

  3. #3
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    OK, I prefer this method using PHP:

    The link around your image (give the popup a size so that it doesn't start off being maximised):
    Code:
    <a href="#" onclick="window.open('popup.php?img=image123.jpg', 'popup', 'toolbar=no,menubar=no,location=no,resizable=yes,scrollbars=no,width=200,height=200');"><img src="thumb123.jpg" /></a>
    And this goes in popup.php:
    Code:
    <html>
    <head><style type="text/css">
    body {margin:0; padding:0;}
    </style>
    <?php
    $image = $_GET['img'];
    $imginfo = getimagesize($image);
    $width = $imginfo[0];
    $height = $imginfo[1];
    
    echo "<script type=\"text/javascript\">window.resizeTo($width,$height)</script>";
    ?>
    </head>
    <body>
    <img src="<?php echo $image; ?> />
    </body>
    </html>

  4. #4
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thats awesome. Much apprieciated!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •