JavaScript sometimes working ok and sometimes not

[Kamyk]

Hello all!

Could you tell me where is the error on the below code, because the script
is sometimes
working correctly and sometimes is not working correctly. I want my new
window with picture
to be fitted/enlarged to original size. The page on the below address:
http://www.kapy.bydg.pl/~marcinz/stolarnia/.
I have Windows XP and IE 6.0. and everything works correctly. If I run the
page on Win 2000, IE 5.0.
it is not good-working.

<SCRIPT LANGUAGE=JAVASC RIPT TYPE="TEXT/JAVASCRIPT">
function funkcja(rysunek )
{

obrazek=new Image()
obrazek.src=rys unek

zmienna_w=obraz ek.width+50
zmienna_h=obraz ek.height+50

zmienna='toolba r=yes,location= yes,scrollbars= yes,width=' + zmienna_w +
',height=' + zmienna_h

return window.open(rys unek,'oknoObr', zmienna)

}

</SCRIPT>
.....
<a href="#"
OnClick="funkcj a('WojtStol_fil es/drzwi/wewnetrzne/100_0114.gif'); "><img
src="WojtStol_f iles/drzwi/wewnetrzne/100_0114.gif" width=150 height=100
border=1></a>
......

[Thomas 'PointedEars' Lahn]

Kamyk wrote:

Could you tell me where is the error on the below code, because the script
is sometimes working correctly and sometimes is not working correctly.
[...]
<SCRIPT LANGUAGE=JAVASC RIPT TYPE="TEXT/JAVASCRIPT">
Omit the deprecated `language' attribute. And although HTML is not
generally case-sensitive, you should use lowercase characters only
where possible.
function funkcja(rysunek )
{

obrazek=new Image() ^[1] [2]^^^^^ ^[3]

[1] Variables should always be declared, using the `var' keyword.

[2] Host objects like Image should be tested prior to usage:
<http://pointedears.de/scripts/test/whatami>, paragraph 2.

[3] Do not rely on automatic semicolon insertion but end all
statements with a semicolon.
obrazek.src=rys unek

zmienna_w=obraz ek.width+50
zmienna_h=obraz ek.height+50
Most certainly it does not work because image loading is done asynchronously
by the UA (while the script engine continues interpretation) and so the
`width' and `height' properties do not return proper values prior. You
should use the `onload' event which should fire once the image has been
loaded and so its dimensions can be obtained:
[...]
<a href="#"
OnClick="funkcj a('WojtStol_fil es/drzwi/wewnetrzne/100_0114.gif'); "><img
src="WojtStol_f iles/drzwi/wewnetrzne/100_0114.gif" width=150 height=100
border=1></a>
The above will not work without script support. The below quick hack
should do:

var obrazek, intv, w;

function funkcja(rysunek )
{
if (typeof Image != "undefined" )
{
obrazek = new Image()

if (window.setInte rval)
{
intv = window.setInter val(
(function()
{
if (obrazek.loaded && w)
{
window.clearInt erval(intv);
if (w.innerWidth)
{
w.innerWidth = obrazek.width + 50;
}
else if (window.clientW idth)
{
w.clientWidth = obrazek.width + 50;
}

if (w.innerHeight)
{
w.innerHeight = obrazek.height + 50;
}
else if (w.clientHeight )
{
w.clientHeight = obrazek.height + 50;
}

if (w.focus) w.focus();
}
}).toString(),
100);
}

obrazek.onload = function()
{
this.loaded = true;
}

obrazek.src = rysunek;

return (w = window.open(
rysunek,
'oknoObr',
'toolbar=yes,lo cation=yes,scro llbars=yes'));
}
}

...

<a href="WojtStol_ files/drzwi/wewnetrzne/100_0114.png"
onclick="return !funkcja(this.h ref);"<img src="WojtStol_f iles/drzwi/wewnetrzne/100_0114_thumbn ail.png"

alt="Alternativ e text -- required!"
width="150" height="100" border="1"></a>

Another alternative which I consider more reliable than your (improved)
approach is generating an entire HTML document to contain the image in
the popup window and use the `onload' handler of either its `body'
element or the `img' element instead, as implemented in enlargeImg():

<http://pointedears.de/scripts/window.js>
PointedEars

[Thomas 'PointedEars' Lahn]

Kamyk wrote:

Could you tell me where is the error on the below code, because the script
is sometimes working correctly and sometimes is not working correctly.
[...]
<SCRIPT LANGUAGE=JAVASC RIPT TYPE="TEXT/JAVASCRIPT">
Omit the deprecated `language' attribute. And although HTML is not
generally case-sensitive, you should use lowercase characters only
where possible.
function funkcja(rysunek )
{

obrazek=new Image() ^[1] [2]^^^^^ ^[3]

[1] Variables should always be declared, using the `var' keyword.

[2] Host objects like Image should be tested prior to usage:
<http://pointedears.de/scripts/test/whatami>, paragraph 2.

[3] Do not rely on automatic semicolon insertion but end all
statements with a semicolon.
obrazek.src=rys unek

zmienna_w=obraz ek.width+50
zmienna_h=obraz ek.height+50
Most certainly it does not work because image loading is done asynchronously
by the UA (while the script engine continues interpretation) and so the
`width' and `height' properties do not return proper values prior. You
should use the `onload' event which should fire once the image has been
loaded and so its dimensions can be obtained:
[...]
<a href="#"
OnClick="funkcj a('WojtStol_fil es/drzwi/wewnetrzne/100_0114.gif'); "><img
src="WojtStol_f iles/drzwi/wewnetrzne/100_0114.gif" width=150 height=100
border=1></a>
The above will not work without script support. The below quick hack
should do:

var obrazek, intv, w;

function funkcja(rysunek )
{
if (typeof Image != "undefined" )
{
obrazek = new Image()

if (window.setInte rval)
{
intv = window.setInter val(
function()
{
if (obrazek.loaded && w)
{
window.clearInt erval(intv);
if (w.innerWidth)
{
w.innerWidth = obrazek.width + 50;
}
else if (window.clientW idth)
{
w.clientWidth = obrazek.width + 50;
}

if (w.innerHeight)
{
w.innerHeight = obrazek.height + 50;
}
else if (w.clientHeight )
{
w.clientHeight = obrazek.height + 50;
}

if (w.focus) w.focus();
}
},
100);
}

obrazek.onload = function()
{
this.loaded = true;
}

obrazek.src = rysunek;

return (w = window.open(
rysunek,
'oknoObr',
'toolbar=yes,lo cation=yes,scro llbars=yes'));
}
}

...

<a href="WojtStol_ files/drzwi/wewnetrzne/100_0114.png"
onclick="return !funkcja(this.h ref);"<img src="WojtStol_f iles/drzwi/wewnetrzne/100_0114_thumbn ail.png"

alt="Alternativ e text -- required!"
width="150" height="100" border="1"></a>

Another alternative which I consider more reliable than your (improved)
approach is generating an entire HTML document to contain the image in
the popup window and use the `onload' handler of either its `body'
element or the `img' element instead, as implemented in enlargeImg():

<http://pointedears.de/scripts/window.js>
PointedEars