new window with picture

K

Kamyk

Hello all!

I would like to open a new window with a picture after clicking on a
shrinked picture which is located on the main page. I want this new window
to be
exactly sized as original dimensions of this image.
Where is the error on the following code??? :

<SCRIPT LANGUAGE=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
function rozmiar(rysuneczek,id)
{
obrazek=new Image()
obrazek.scr=rysuneczek

if (id==1)
{
//rozmiar=obrazek.width
}
else
{
rozmiar=obrazek.height
}

}

function funkcja(rysunek)
{
oknoObrazka=window.open(rysunek,'oknoObr','toolbar=yes,location=yes,scrollba
rs=yes,width=' + rozmiar(rysunek,1) + ',height=' + rozmiar(rysunek,2))
oknoObrazka.focus()
}

</SCRIPT>
......
<a href="javascript:funkcja('WojtStol_files/meble/100_0135.gif');"><img
src="WojtStol_files/meble/100_0136.gif" width=150 height=100 border=1></a>
......

Thanks for help
Marcin from Poland
 
S

Stephen Chalmers

Kamyk said:
Hello all!

I would like to open a new window with a picture after clicking on a
shrinked picture which is located on the main page. I want this new window
to be
exactly sized as original dimensions of this image.
Where is the error on the following code??? :

<SCRIPT LANGUAGE=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
function rozmiar(rysuneczek,id)
{
obrazek=new Image()
obrazek.scr=rysuneczek

if (id==1)
{
file://rozmiar=obrazek.width
}
else
{
rozmiar=obrazek.height
}

}

function funkcja(rysunek)
{
oknoObrazka=window.open(rysunek,'oknoObr','toolbar=yes,location=yes,scrollba
rs=yes,width=' + rozmiar(rysunek,1) + ',height=' + rozmiar(rysunek,2))
oknoObrazka.focus()
}

</SCRIPT>
.....
<a href="javascript:funkcja('WojtStol_files/meble/100_0135.gif');"><img
src="WojtStol_files/meble/100_0136.gif" width=150 height=100 border=1></a>

obrazek.scr=rysuneczek
Should be: obrazek.src=rysuneczek

Your function rozmiar() must be coded to return a value, or the statements:
width=' + rozmiar(rysunek,1) and height=' + rozmiar(rysunek,2) will evaluate
to undefined.

Having said that, if you want the dimensions to be calculated rather than
specified manually, it may be better to write the function so that it need
be called only once, by having it return a string of the form:
"width=w,height=h"
rozmiar=obrazek.height
This creates a global variable with the same name as the function, which has
the effect of destroying the function.

You still need further code to display the image in the new window.
 
M

McKirahan

--
--D. McKirahan
(e-mail address removed)


Kamyk said:
Hello all!

I would like to open a new window with a picture after clicking on a
shrinked picture which is located on the main page. I want this new window
to be
exactly sized as original dimensions of this image.
Where is the error on the following code??? :

<SCRIPT LANGUAGE=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
function rozmiar(rysuneczek,id)
{
obrazek=new Image()
obrazek.scr=rysuneczek

if (id==1)
{
//rozmiar=obrazek.width
}
else
{
rozmiar=obrazek.height
}

}

function funkcja(rysunek)
{
oknoObrazka=window.open(rysunek,'oknoObr','toolbar=yes,location=yes,scrollba
rs=yes,width=' + rozmiar(rysunek,1) + ',height=' + rozmiar(rysunek,2))
oknoObrazka.focus()
}

</SCRIPT>
.....
<a href="javascript:funkcja('WojtStol_files/meble/100_0135.gif');"><img
src="WojtStol_files/meble/100_0136.gif" width=150 height=100 border=1></a>
.....

Thanks for help
Marcin from Poland

One problem is that you misspelled ".src" as ".scr".

Try the following "as-is"; watch for word-wrap.

<html>
<head>
<title>Marcin.htm</title>
<script type="text/javascript">
var x = 0;
var y = 0;
function rozmiar(rysuneczek) {
var obrazek = new Image();
obrazek.src = rysuneczek;
x = obrazek.width;
y = obrazek.height;
}
function funkcja(rysunek) {
rozmiar(rysunek);
var z = "scrollbars=no,width=" + (x+20) + ",height=" + (y+20);
oknoObrazka=window.open(rysunek,'oknoObr',z);
}
</script>
</head>
<img src="WojtStol_files/meble/100_0136.gif" border="1" width="150" height="100"></a>
<hr>
<a
href="javascript:funkcja('http://www.google.com/intl/en/images/logo.gif');"
<img src="http://groups-beta.google.com/images/google_sm.gif"
border="1" width="143" height="59"></a>
</body>
</html>

The width and height are padded because of the default margins.

Why would you want "scrollbars=yes" if it's supposed to fit the new window?

Also, why include "toolbar=yes,location=yes," as they clutter the new
window?
 
D

DU

McKirahan said:
--
--D. McKirahan
(e-mail address removed)





One problem is that you misspelled ".src" as ".scr".

Try the following "as-is"; watch for word-wrap.

<html>
<head>
<title>Marcin.htm</title>
<script type="text/javascript">
var x = 0;
var y = 0;
function rozmiar(rysuneczek) {
var obrazek = new Image();
obrazek.src = rysuneczek;
x = obrazek.width;
y = obrazek.height;
}
function funkcja(rysunek) {
rozmiar(rysunek);
var z = "scrollbars=no,width=" + (x+20) + ",height=" + (y+20);

The default margin on root element is 15 for top and bottom and 10 for
left and right in MSIE 6. So here, you have miscalculated the height
with +20. I noticed you removed scrollbars for no given reason when, if
your calculations are wrong or correct - whatever -, you should always
provide normal fallback mechanisms to take over. You removed implicitly
capability to resize the window for the user and you removed explicitly,
intentionally capability to scroll the window if needed, if content
overflows requested window dimensions.
oknoObrazka=window.open(rysunek,'oknoObr',z);
}
</script>
</head>


border="1" width="143" height="59"></a>

If javascript support is disabled, then the user won't be able to view
the image at all. If the user uses Ctrl+click or middle-click on the
link, he won't be able to view the image at all.

Top Ten Web-Design Mistakes of 2002;
6. JavaScript in Links
http://www.useit.com/alertbox/20021223.html

comp.lang.javascript FAQ:
"javascript:" links
http://jibbering.com/faq/#FAQ4_24
</body>
</html>

The width and height are padded because of the default margins.

Why would you want "scrollbars=yes" if it's supposed to fit the new window?

Just in case the designer miscalculated the margin on the root element.
Also, why include "toolbar=yes,location=yes," as they clutter the new
window?

If the user wants to bookmark the page, removing toolbar and location
bar won't help. If the user wants to use the toolbar - whatever the
reason - say to print the image -, your code not only removes the
toolbar but also prevents the user from getting it back on.

DU
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,770
Messages
2,569,583
Members
45,075
Latest member
MakersCBDBloodSupport

Latest Threads

Top