Script doesn't work in Firefox

N

niconedz

Hi

The following code works fine in IE but not Firefox.
It's a little script that zooms an image and resizes the window to fit.
Can anybody tell me what's wrong?

Thanks
Nico

== btw.. sorry for the long post ==

<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<title>Aphrodite Hills</title>
<style type="text/css">
<!--
**SNIPPED**
-->
</style>

<script language="JavaScript">
<!--

function SymError()
{
return true;

}

window.onerror = SymError;

//-->
</script>

<script language="javascript"><!--
function window_resize(o_img, int_offset_h,
int_offset_w) {
table_all.style.visibility="hidden";
var int_max_h = window.screen.availHeight;
var int_max_w = window.screen.availWidth;
var int_size_h = o_img.height + int_offset_h;
int_size_h = (int_size_h > int_max_h) ?
int_max_h : int_size_h;
var int_size_w = o_img.width + int_offset_w;
int_size_w = (int_size_w > int_max_w) ?
int_max_w : int_size_w;
//window.moveTo(0,0);
int_size_w = (int_size_w>390)? int_size_w :
390;
window.resizeTo(int_size_w, int_size_h);
self.focus();
table_all.style.visibility="visible";
}

function resize(k) {
table_all.style.visibility="hidden";
self.o_img.width *= k;
self.o_img.height *= k;
window.resizeTo(self.o_img.width+50,
self.o_img.height+135);
table_all.style.visibility="visible";
}

function on_key_press() {
if (event.keyCode == "27") this.close();
else if (event.keyCode==43) resize(1.1);
else if (event.keyCode==45) resize(.9);
}
-->
</script>
</head>

<body onload="javascript:window_resize(self.o_img, 135, 50);"
onkeypress="on_key_press();">

<table id="table_all" height="100%" width="100%" border="0"
cellpadding="0" cellspacing="0">
<tr>
<td>
<table width="100%" border="0" cellpadding="0"
cellspacing="0">
<tr>
<td>
<div align="left"><nobr>
<img src="assets/magnify_plus.gif" style="cursor:hand"
onclick="javascript:resize(1.1);" WIDTH="107" HEIGHT="24">
<img src="assets/magnify_minus.gif" style="cursor:hand"
onclick="javascript:resize(.9);" WIDTH="117" HEIGHT="24">
<a style="cursor:hand" onClick="window.print();"><img
src="assets/print.gif" width="89" height="24" border="0"></a>

</nobr></div></td>
</tr>
</table>
</td>
</tr>
<tr height="1">
<td bgcolor="#DDDECC"><img SRC="assets/spacer_trans.gif"
width="1"
height="1"></td>
</tr>
<tr>
<td align="center" valign="middle">
<img src="assets/plot239/dev239.jpg" name="o_img" width="390"
height="310" hspace="5" vspace="5" border="0" align="top" id="o_img">
</td>
</tr>
</table>
</body>
</html>
 
R

RobG

niconedz said:
Hi

The following code works fine in IE but not Firefox.
It's a little script that zooms an image and resizes the window to fit.
Click to expand...

Not all users or all browsers will let you re-size the window, so expect
that it won't work at least sometimes.
Can anybody tell me what's wrong?
Click to expand...

Normally you should explain what you consider 'wrong'. Did you get any
errors from the Firefox script console?
Thanks
Nico

== btw.. sorry for the long post ==
Click to expand...

That's OK *if* you make it so the code can be copied and pasted into a
file, then run without error. Use 2 or 4 spaces for indents, not tabs
or 8 spaces or so. Manually break lines at about 70 characters to
prevent news readers from automatically breaking them and introducing
errors.
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<title>Aphrodite Hills</title>
<style type="text/css">
<!--
**SNIPPED**
-->
</style>
Click to expand...

For the sake of posting sample code, just ditch the style element
completely. Using HTML comment tags inside a style element may cause
problems of itself.
<script language="JavaScript">
Click to expand...

The language attribute is depreciated, type is required:

<!--
Click to expand...

Don't use HTML comment tags inside script elements - they are
potentially harmful and have been unnecessary since about Netscape 2 and
IE 3 (let's say 10 years). ;-)
function SymError()
{
return true;

}

window.onerror = SymError;
Click to expand...

Right here you destroy your chance to see the error messages that might
help you - it stops anything useful going to the Firefox script console.

//-->
</script>

<script language="javascript"><!--
function window_resize(o_img, int_offset_h,
int_offset_w) {
table_all.style.visibility="hidden";
Click to expand...

Here's one error - using an ID attribute as a global variable:

var table_all = document.getElementById('table_all');

You should not assume support for the style object, so:

if (table_all.style) {
table_all.style.visibility = "hidden";
}

I guess strictly you should also test for getElementById and offer
document.all if it is not available, but that is only really necessary
if you want to support IE 4.
var int_max_h = window.screen.availHeight;
var int_max_w = window.screen.availWidth;
var int_size_h = o_img.height + int_offset_h;
int_size_h = (int_size_h > int_max_h) ?
int_max_h : int_size_h;
var int_size_w = o_img.width + int_offset_w;
int_size_w = (int_size_w > int_max_w) ?
int_max_w : int_size_w;
//window.moveTo(0,0);
int_size_w = (int_size_w>390)? int_size_w :
390;
window.resizeTo(int_size_w, int_size_h);
self.focus();
table_all.style.visibility="visible";
}

function resize(k) {
table_all.style.visibility="hidden";
Click to expand...

Here it is again.
self.o_img.width *= k;
self.o_img.height *= k;
Click to expand...

That method of referring to an image doesn't work in Firefox, though it
does support the images collection (as do nearly all browsers) 'cos it's
part of DOM 0:

var o_img = document.images['o_img'];
o_img.width *= k;
...
window.resizeTo(self.o_img.width+50,
self.o_img.height+135);
table_all.style.visibility="visible";
}

function on_key_press() {
if (event.keyCode == "27") this.close();
Click to expand...

IE has a different event model to other browsers - event is a property
of the global object (window.event), but for others you need to pass the
event to the function. For old Netscape, you need 'which', storing the
value in a local variable saves looking it up multiple times:

function on_key_press(e) {
var e = e || window.event;
var k = e.keyCode || e.which;
if ("27" == k) this.close();
...

and call with:

on_key_press(event);
else if (event.keyCode==43) resize(1.1);
else if (event.keyCode==45) resize(.9);
}
-->
</script>
</head>

<body onload="javascript:window_resize(self.o_img, 135, 50);"
Click to expand...

There is no need for 'javascript:'. Again, self.o_img fails in Firefox,
use:

<body onload="window_resize(document.images['o_img'], 135, 50);"
onkeypress="on_key_press();">
onkeypress="on_key_press(event);">


<table id="table_all" height="100%" width="100%" border="0"
cellpadding="0" cellspacing="0">
<tr>
<td>
<table width="100%" border="0" cellpadding="0"
cellspacing="0">
<tr>
<td>
<div align="left"><nobr>
Click to expand...

'nobr' is not a valid element (unless you use a different DTD to that
specified in your DOCTYPE):

<img src="assets/magnify_plus.gif" style="cursor:hand"
onclick="javascript:resize(1.1);" WIDTH="107" HEIGHT="24">
Click to expand...

All your onclick attributes don't need 'javascript:'.
<img src="assets/magnify_minus.gif" style="cursor:hand"
Click to expand...

use "cursor: pointer;"

onclick="javascript:resize(.9);" WIDTH="117" HEIGHT="24">
<a style="cursor:hand" onClick="window.print();"><img
src="assets/print.gif" width="89" height="24" border="0"></a>

</nobr></div></td>
</tr>
</table>
</td>
</tr>
<tr height="1">
<td bgcolor="#DDDECC"><img SRC="assets/spacer_trans.gif"
width="1"
height="1"></td>
</tr>
<tr>
<td align="center" valign="middle">
<img src="assets/plot239/dev239.jpg" name="o_img" width="390"
height="310" hspace="5" vspace="5" border="0" align="top" id="o_img">
Click to expand...

hspace, vspace, etc. are depreciated, use styles instead.
 
T

Thomas 'PointedEars' Lahn

RobG said:
For the sake of posting sample code, just ditch the style element
completely. Using HTML comment tags inside a style element may cause
problems of itself.
Click to expand...

No, they should not cause any problems in _HTML_ (and have none caused
with me to date). First, they are not "HTML comment tags" but empty SGML
declarations (delimited by "<!" and ">") containing only SGML comments
(delimited by "--"). Second, all CSS specifications to date and the
most recent Working Draft specify them to be allowed and to be ignored
if present, see

- CSS1, section 1.1
<http://www.w3.org/TR/CSS1#containment-in-html>

- CSS2, section D.2
<http://www.w3.org/TR/CSS2/grammar.html#q2>

- CSS2.1 (CR gone WD as of 13 June 2005), section G.2
<script language="JavaScript">
Click to expand...

The language attribute is depreciated, type is required: [...]
Click to expand...

The word you were looking for is "deprecated", otherwise you are correct.
Right here you destroy your chance to see the error messages that might
help you - it stops anything useful going to the Firefox script console.

<URL:http://www.mozilla.org/docs/dom/domref/dom_window_ref58.html>
Click to expand...

You are correct, however this bad code originates from Norton
In(ternet)Security by $ymantec. It's better to uninstall
much-too-expensive nonsense such as "Desktop Firewalls" and learn
how to use system resources to protect themselves instead (e.g. by
disabling/uninstalling unnessary networking services instead of
introducing new ones).
[...]
I guess strictly you should also test for getElementById and offer
document.all if it is not available, but that is only really necessary
if you want to support IE 4.
Click to expand...

.... or IE < 5.5 on Windows CE (according to MSDN Library).


PointedEars
 

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

Similar Threads

Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
Uncaught ReferenceError: item is not defined at HTMLButtonElement.onclick in the: <button onclick="item.inserir()">Inserir dados</button> 1
An unknown bug doesn't allow the quotes app to work. What's the issue? 3
Image shifts to the right when export the page to pdf 4
On-air script 0
When draggable=false & draggable=true dont work ? 1
SendGrid email issue in responsive Gmail 1
Help with Visual Lightbox: Scripts 2

Members online

Total: 35 (members: 2, guests: 33)
Robots: 337

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,011
Latest member
AjaUqq1950

Latest Threads

Top