471,310 Members | 1,405 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,310 software developers and data experts.

JavaScript sometimes working ok and sometimes not

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=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
function funkcja(rysunek)
{

obrazek=new Image()
obrazek.src=rysunek

zmienna_w=obrazek.width+50
zmienna_h=obrazek.height+50

zmienna='toolbar=yes,location=yes,scrollbars=yes,w idth=' + zmienna_w +
',height=' + zmienna_h

return window.open(rysunek,'oknoObr',zmienna)

}

</SCRIPT>
.....
<a href="#"
OnClick="funkcja('WojtStol_files/drzwi/wewnetrzne/100_0114.gif');"><img
src="WojtStol_files/drzwi/wewnetrzne/100_0114.gif" width=150 height=100
border=1></a>
......
Jul 23 '05 #1
2 6363
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=JAVASCRIPT 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=rysunek

zmienna_w=obrazek.width+50
zmienna_h=obrazek.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="funkcja('WojtStol_files/drzwi/wewnetrzne/100_0114.gif');"><img
src="WojtStol_files/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.setInterval)
{
intv = window.setInterval(
(function()
{
if (obrazek.loaded && w)
{
window.clearInterval(intv);
if (w.innerWidth)
{
w.innerWidth = obrazek.width + 50;
}
else if (window.clientWidth)
{
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,location=yes,scrollbars=yes'));
}
}

...

<a href="WojtStol_files/drzwi/wewnetrzne/100_0114.png"
onclick="return !funkcja(this.href);"<img src="WojtStol_files/drzwi/wewnetrzne/100_0114_thumbnail.png"

alt="Alternative 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
Jul 23 '05 #2
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=JAVASCRIPT 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=rysunek

zmienna_w=obrazek.width+50
zmienna_h=obrazek.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="funkcja('WojtStol_files/drzwi/wewnetrzne/100_0114.gif');"><img
src="WojtStol_files/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.setInterval)
{
intv = window.setInterval(
function()
{
if (obrazek.loaded && w)
{
window.clearInterval(intv);
if (w.innerWidth)
{
w.innerWidth = obrazek.width + 50;
}
else if (window.clientWidth)
{
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,location=yes,scrollbars=yes'));
}
}

...

<a href="WojtStol_files/drzwi/wewnetrzne/100_0114.png"
onclick="return !funkcja(this.href);"<img src="WojtStol_files/drzwi/wewnetrzne/100_0114_thumbnail.png"

alt="Alternative 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
Jul 23 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by Christian Kusenbach | last post: by
6 posts views Thread by Andy | last post: by
136 posts views Thread by Matt Kruse | last post: by
3 posts views Thread by krishna | last post: by
3 posts views Thread by tshad | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.