Forum Moderators: open

Message Too Old, No Replies

How To make New Browser Window the size of a graphic?

Need to have a new browser window open to show a more detailed graphic

         

peter andreas

1:01 pm on Apr 21, 2004 (gmt 0)

10+ Year Member



Does anyone know if you can specify the size of a new browser window so that it fits the size of a graphic I am trying to display. The link is just to an image (a map actually) but I have a lot of blank window space as its full size. Is there a way to specify the dimensions? Thanks
I'm using
...target="_blank" href="/_map.jpg">Click for map</a>

moltar

1:26 pm on Apr 21, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



window.open('/path/to/img.jp', 'img_name',
*'width=NNN,height=NNN,toolbar=no,location=no,directories=no,
*status=no,menubar=no,scrollbars=yes,copyhistory=no,resizable=no');

*= line break added to prevent side scroll

[edited by: tedster at 8:06 pm (utc) on April 21, 2004]

Alternative Future

1:32 pm on Apr 21, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Nice trick!

>width=NNN height=NNN
I have always wondered if there is a way of putting width and height attributes into the img tag before knowing what actual size they were going to be. i.e. a dymanic page looping through an array of images each with differant height values.

How does the html validator handle this?

-George

Bonusbana

1:47 pm on Apr 21, 2004 (gmt 0)

10+ Year Member



In PHP you can retrieve such information from an image file.

A quick note about the window popup script: internet explorer 4 & 4.5 spawns windows 17px too short.

<added>on the macintosh platform that is</added>

Alternative Future

1:50 pm on Apr 21, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Cheers Bonusbana,

Am using JSP's so there should be something the same there...

Cheers for the pointer...

-George

gethan

2:32 pm on Apr 21, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



> How does the html validator handle this?

It's not html - it's javascript ;)

Alternative Future

2:35 pm on Apr 21, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



>>It's not html - it's javascript

So it would'nt work in the <img src="" width="nnn" height="nnn"> tag then?

-George

Alternative Future

2:47 pm on Apr 21, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Ahh I just knocked up a dummy page and it doesn’t display the image atoll :)
I thought it might have worked in a similar fashion to, the td width tag where you can place a # to account for all left over space inherited from its parent element not already taken.

-George

moltar

6:34 pm on Apr 28, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



NNN is just a place holder for a number. It does not really represent anything. And there is no special functionality built in for handling NNN. I just put it there to show that width and height values supposed to go in there.

tedster

6:40 pm on Apr 28, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I like to create a custom function to accept variables for the width and height of a new window:

In the HEAD or External JS file:

function cPop(url, wide, high)
{window.open(url,"popup",'width=' + wide + ',height=' + high);
}

In the BODY:

<a href="javascript:cPop('page.html',300,500)">Click for enlargement</a>

Here 300 and 500 are the width and height parameters. You can put the numbers you ned for each graphic. Replace page.html with the actual name of the URL that you want to load in the popup window.

tedster

6:49 pm on Apr 28, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



A quick note about the features string when you open a new window. Once you explicitly include any single feature, like "resizable=" or "status=" or "scrollbars=", then any feature you have not named will automatically default to "no". That helps keep the code short -- you only need to include the items that are =yes.

Bonusbana

8:04 am on Apr 29, 2004 (gmt 0)

10+ Year Member



<script type="text/javascript">

function cPop(url, wide, high) {
window.open(url,"popup",'width=' + wide + ',height=' + high);
}

</script>

<?php

$image="path/to/image.jpg"; #pointer to image

list($width, $height, $type, $attr) = getimagesize($image);
$js="cPop(\"$image\",$width,$height);";

?>

<body>
<a href="javascript:<?php echo $js;?>">image link</a>
</body>