By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,404 Members | 2,145 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,404 IT Pros & Developers. It's quick & easy.

Script doesn't work in Firefox

P: n/a
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>

Oct 13 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
niconedz wrote:
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.
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?
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 ==
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>
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">
The language attribute is depreciated, type is required:

<script type="text/javascript">
<!--
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;
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>

//-->
</script>

<script language="javascript"><!--
function window_resize(o_img, int_offset_h,
int_offset_w) {
table_all.style.visibility="hidden";
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";
Here it is again.
self.o_img.width *= k;
self.o_img.height *= k;
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();
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);"
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>
'nobr' is not a valid element (unless you use a different DTD to that
specified in your DOCTYPE):

<URL:http://www.cs.tut.fi/~jkorpela/html/nobr.html>
<img src="assets/magnify_plus.gif" style="cursor:hand"
onclick="javascript:resize(1.1);" WIDTH="107" HEIGHT="24">
All your onclick attributes don't need 'javascript:'.
<img src="assets/magnify_minus.gif" style="cursor:hand"
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">
hspace, vspace, etc. are depreciated, use styles instead.

</td>
</tr>
</table>
</body>
</html>

--
Rob
Oct 14 '05 #2

P: n/a
Rob.. you are a diamond !!!

It worked beautifully.

Thank you ever so much.

Oct 14 '05 #3

P: n/a
RobG wrote:
niconedz wrote:
<!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>
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.


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
<http://www.w3.org/TR/CSS21/grammar.html#q2>
<script language="JavaScript">


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


The word you were looking for is "deprecated", otherwise you are correct.
function SymError()
{
return true;

}

window.onerror = SymError;


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>


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.


.... or IE < 5.5 on Windows CE (according to MSDN Library).
PointedEars
Oct 18 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.