javascript popup window resize

Posted on 2004-11-21
Last Modified: 2008-02-07
i want to dynamically set the size of the popup window based on the image's size that its displaying. i have a working model at but the problem is its not resizing it correctly. (the lines with arrow tips show the image size)

i have pasted my code below for zoom.php

also, i want to know if this will work on macs, and old browsers.

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="imagetoolbar" content="false">
function resizeWindow(){
      var sizeX = document.getElementById('image').offsetWidth+0;
      var sizeY = document.getElementById('image').offsetHeight+0;
<title>Image Zoom</title>
<body onload="resizeWindow();" style="margin: 0px 0px 0px 0px; text-align: center; font: normal 10px verdana; color: #666; background: #fff;">
<div id="loading" style="display: block;">LOADING</div>
<a href="javascript:self.close();" onmousedown="self.close();"><img id="image" style="visibility: hidden; padding: 0px; border: 0px solid #FFC8AD;" src="<?php echo $image ?>" alt="Click to close window" border="0"></a>
document.getElementById('image').onload = resizeWindow;
Question by:qwertq
    LVL 25

    Accepted Solution

    LVL 15

    Expert Comment

    Awoid using the resizeTO function. The different browsermakers implement it differently, some saying the outer dimentions of the browser should have that size, some sayint the displayarea inside the window should be set to that size.

    Supress scroll bars in that window. A scrollbar makes the window some 12-15 pixels smaller, and again browsermakers disagree on how that should be handeled.

    Here is my version  ( NB: its old. I did not consider scrollbars :-)).

    regards JakobA

    Author Comment

    devic, how can i add additional space, say if i wanted a 20 pixel high footer at the bottom.
    LVL 25

    Expert Comment

    iHeight = document.images[0].height - iHeight;
    change to:
    iHeight = document.images[0].height - iHeight+40;

    document.write( "<img src='" + picUrl + "' border=0>" );
    change to:
    document.write( "<img src='" + picUrl + "' border=0 vspace=20>" );

    qwertq , as you see is not difficult, don't afraid to experiment, this is a good way to understand what is what ;)

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Training Course: Adobe Dreamweaver CC 2015

    Adobe Dreamweaver Creative Cloud is used by web designers and front-end developers and allows you to visualize your site in real-time as you code. This course covers exam objectives for the Adobe Certified Associate (ACA) certification.

    Suggested Solutions

    Avoid defining the variables in the global scope; trying to define them in a local function scope. Because:   • Look-up is performed every time a variable is accessed.   • Variables are resolved backwards from most specific to least specific scope…
    This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    779 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    11 Experts available now in Live!

    Get 1:1 Help Now