Advertisement

08.27.2008 at 06:09AM PDT, ID: 23681810 | Points: 500
[x]
Attachment Details

Resizing Popup Window To Image Dimensions (Troubleshoot Code Help)

Asked by thyros in JavaScript, Hypertext Markup Language (HTML), Extensible HTML (XHTML)

Hi,

We want to create a popup window without any scrollbars, minimal toolbars etc, resizing to fit an image's width and height.  On the fly (there are too many images that we need to automate this).

The closest solution I came across is the following;

http://www.sitepoint.com/article/resize-popup-fit-images-size

However, the code seems dated and Firefox has problems resizing correctly (the width gets cut short).  I found a discussion forum on a similar topic;

http://www.sitepoint.com/forums/showthread.php?t=178564

I am not knowledgeable about Javascript, so it would be much appreciated if someone could update and troubleshoot this code for me so that the width resize is done correctly in Firefox (IE seems to be ok).


The following is what is shown from the main window (where the popup is launched from)

<a id="ProductDetails_hypThumbnail" href="javascript:openlarge('/shopping/imageautoresize.htm?/images/products/4260/614025.jpeg')"><img src="/images/products/4260/T_614025.jpeg"></a>

<script type="text/javascript">
    <!--
        function openlarge(url)
        {
            if(url.indexOf("na.gif") == -1)
            {
                window.open(url, "techspecsimage", "scrollbars=0, titlebar=0, resizable=1, location=0, directories=0, status=0, height=150, width=150, left=80, top=100," );
            }
        }
    //-->
</script>

The attached code snippet is called 'ImageAutoResize.htm';

Start Free Trial 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>tech specs image</title>
 
    <script type="text/javascript" language="javascript">
       var arrTemp=self.location.href.split("?");
       var picUrl = (arrTemp.length>0)?arrTemp[1]:"";
       var NS = (navigator.appName=="Netscape")?true:false;
 
         function FitPic() {
           iWidth = (NS)?window.innerWidth:document.body.clientWidth;
           iHeight = (NS)?window.innerHeight:document.body.clientHeight;
           iWidth = document.images[0].width - iWidth;
           iHeight = document.images[0].height - iHeight;
           window.resizeBy(iWidth,iHeight);
           self.focus();
         };
    </script>
 
    <style type="text/css">
        html, body {
        height:100%;
        margin:0;
        padding:0;
        }
    </style>
</head>
<body onload='FitPic();' style="margin: 0px; background: #FFFFF;">
 
    <script type="text/javascript" language="javascript">
	    document.write( "<a href='javascript:window.close()'><center><img src='" +picUrl +"' border=0></center></a>" );
    </script>
 
</body>
</html>
 
Keywords: Resizing Popup Window To Image Dime…
Title
1 Firefox Popup
2 window.open issue with Firefox
3 How do I get javascript popups to wor…
4 Firefox Problem with window.open c…
5 Window.open
6 Window.Open will not work.
 
Loading Advertisement...
 
[+][-]08.27.2008 at 07:22PM PDT, ID: 22330920

At Experts Exchange, members can ask their questions to thousands of technology professionals, also known as Experts. Experts compete and collaborate to answer those questions by leaving comments like this one.

Start your 7-day free trial to view this Expert Comment or ask the Experts your question.

 
[+][-]08.28.2008 at 12:23AM PDT, ID: 22332270

At Experts Exchange, members can ask their questions to thousands of technology professionals, also known as Experts. Experts compete and collaborate to answer those questions by leaving comments like this one.

Start your 7-day free trial to view this Expert Comment or ask the Experts your question.

 
[+][-]09.08.2008 at 07:06AM PDT, ID: 22417431

Often, when Experts are collaborating with members who have asked questions, they will request additional information about the problem. Askers respond with an author comment like this one.

Start your 7-day free trial to view this Author Comment or ask the Experts your question.

 
[+][-]09.13.2008 at 10:56AM PDT, ID: 22468515

Often, when Experts are collaborating with members who have asked questions, they will request additional information about the problem. Askers respond with an author comment like this one.

Start your 7-day free trial to view this Author Comment or ask the Experts your question.

 
[+][-]09.14.2008 at 11:16AM PDT, ID: 22473662

Often, when Experts are collaborating with members who have asked questions, they will request additional information about the problem. Askers respond with an author comment like this one.

Start your 7-day free trial to view this Author Comment or ask the Experts your question.

 
 
Loading Advertisement...
20080716-EE-VQP-32 / EE_QW_2_20070628