SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    orange pips! orange pips!
    Join Date
    Oct 2001
    Location
    Its all about location
    Posts
    652
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing window size

    I have a photo gallery which lists out a bunch of photos. You can click on one which will open the photo in another window for you to view. In this window then, you are able to go to the next image, to the previous one, etc.

    Now, I have some images which are portrait style, some are landscape. I want to have the window that the images show in to be adjusted on the fly depending on the orientation of the photo. I.e., if the photo is landscape, I want to display it in a window which is 800x600 in size; if it's portrait, I want to display it in a window which is 600x800.

    All the thumbnails have the following code for their href:
    PHP Code:
       if ($portrait)
       {
        
    $href "'NewWindow(\"viewer.php?id=" $row["id"] . "\", \"photoViewer\", 600, 800);'";
       }
       else
       {
        
    $href "'NewWindow(\"viewer.php?id=" $row["id"] . "\", \"photoViewer\", 800, 600);'";
       }
       
    $output .= "<a href="#" onclick=$href><img src="../images/gallery/" . $row["filename"] . "" width='_REPLACE_WIDTH_' height='_REPLACE_HEIGHT_' alt='" . $row["shortDescription"] . "' border='0'/></a>"; 
    The NewWindow javascript function is:
    Code:
     
    function NewWindow(mypage,myname,w,h)
    {
     LeftPosition = (screen.width) ? (screen.width-w)/2 : 0;
     TopPosition = (screen.height) ? (screen.height-h)/2 : 0;
     settings = 'height='+h+',width='+w+',top='+TopPosition+',left='+LeftPosition+',directories=no,location=no,menubar=no,resizable=no,scrollbars=yes,status=yes,toolbar=no';
     win = window.open(mypage,myname,settings);
    }
    This brings up the window perfectly, 800x600 (or 600x800) size just like it should.

    Now, in the pic viewer page I have this code at the very top in the head to change the size of the window according to the sizes of the image I am about to display:
    PHP Code:
    <script language='javascript' type='text/javascript'>
       <?php
        
    if($size[0] > $size[1])
        {
         echo(
    "window.resizeTo('800','600');");
        }
        else
        {
         echo(
    "window.resizeTo('600','800');");
        }
       
    ?>
      </script>
    When this code is on the viewer page, the window isn't 800x600, as it window to have scrollbars to scroll down to see text after the image is displayed. If I remove the resizeTo code, the window is shown at 800x600 and there are no scrollbars shown.

    Why is resizeTo making my window smaller than the NewWindow function?

  2. #2
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's because of the chrome (the frame of the window).

    window.open opens a windows with the inside of the window matching your dimensions. window.resizeTo resizes the outside of the window to match your dimensions.

    http://www.joh6nn.com/script/misc/resizein.htm
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev





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
  •