Javascript & Firefox: simple code don't executed

[giordan]

Hi all!
I've wrote this code:

[code=javascript]
<script type="text/javascript">
var largImg;
var altImg;
var txtTop = '<b>Ottima scelta!</b> Ora compila il form e premi "Ricevi banner". Il codice HTML ti verrà mostrato in questa pagina e, per comodità, ti verrà inviato, via mail, all\'indirizzo da te fornito. Se invece vuoi cambiare il banner premi "Seleziona banner"';
var txtButton = 'Cambia banner';
var testo = '';
var maxLarg = 450;
var maxAlt = 80;
var diffLarg;
var diffAlt;
var diff;
function setBanner(url, id){
window.opener.d ocument.getElem entById("testoR eceive").innerH TML = txtTop;
window.opener.d ocument.getElem entById("banner Sel").value = txtButton;
largImg = window.document .getElementById (id).width;//parseInt(url.sp lit("/")[url.split("/").length-1].split("_")[0].split("x")[0]);

altImg = window.document .getElementById (id).height;//parseInt(url.sp lit("/")[url.split("/").length-1].split("_")[0].split("x")[1]);

txtLarg = "Larghezza: " + largImg + "px";
txtAlt = "Altezza: " + altImg + "px";
diff = (largImg - altImg) + Math.abs(largIm g - altImg);alert(d iff);
testo += '<table cellpadding="0" cellspacing="0" width="100%">'; alert(1);
testo += '<tr>';
testo += '<td valign="middle" >';
testo += '<img id="previewBann er" src="' + url + '"/>';
testo += '</td>';
if(diff != 0){
testo += '</tr><tr>';
}
testo += '<td valign="middle" >';
testo += txtLarg + '<br/><br/>';
testo += txtAlt;
testo += '</td>';
testo += '</tr>';
testo += '</table>';
window.opener.d ocument.getElem entById("divBan ner").innerHTM L = testo;
diffLarg = (largImg - maxLarg) + Math.abs(largIm g - maxLarg);
diffAlt = (altImg - maxAlt) + Math.abs(altImg - maxAlt);
if(diffLarg != 0){
if(diffAlt != 0){
var propDiff = (Math.abs(largI mg - maxLarg) - Math.abs(altImg - maxAlt)) + Math.abs(Math.a bs(largImg - maxLarg) - Math.abs(altImg - maxAlt));
if(propDiff != 0){
window.opener.d ocument.getElem entById("previe wBanner").style .width = maxLarg + 'px';
}
else{
window.opener.d ocument.getElem entById("previe wBanner").style .height = maxAlt + 'px';
}
}
else{
window.opener.d ocument.getElem entById("previe wBanner").style .width = maxLarg + 'px';
}
}
else{
if(diffAlt != 0){
window.opener.d ocument.getElem entById("previe wBanner").style .width = maxAlt + 'px';
}
else{
window.opener.d ocument.getElem entById("previe wBanner").style .width = largImg + 'px';
window.opener.d ocument.getElem entById("previe wBanner").style .height = altImg + 'px';
}
}
window.close();
}
</script>
[/code]

It's simple:
1) the caller send an url like "140x257_1. jpg" and an id generated by xsl
2) the function substitute what's in caller page's "testoRecei ve" div with a pre-set variable
3) change the value of a caller page's button
4) get the dimension of the image
5) check which dimension is the higher with a difference. If largImg is higher than altImg, diff will not be 0.
Ex: (5 - 3) + abs(5-3) = 2 + 2 = 4; Ex2: (3 - 5) + abs(3 - 5) = -2 + 2 = 0
6) insert into variable "testo" the HTML code to create a table.
7) use variable testo as HTML of caller page's divBanner div
8) check if the dimensions are higher than a max. If it's, resize the image.
9) set image's width and height.

My problem is: firefox execute the function until "alert(diff )" included. From next istruction don't do anything.
I've tried to remove all table's attribute but nothing change, I've tried to insert <tbody> but nothing.
Someone would help me please?
Thank you.

[acoder]

Does it not even alert 1 on line 22? What error message do you get?

[giordan]

The only alert I have is at line 21.
Click here to try.
Pressing "Seleziona banner" ("select banner" translated in english) you have the page. It's an xml page formatted with an xsl stylesheet. The script is inside the xsl code. So if you try to get the source you'll have an xml page.
Click here to have the complete xsl file.

Thank you!

[acoder]

In Firefox, I see the error:
window.opener.d ocument.getElem entById("previe wBanner") has no properties
http://www.naera.it/public/xml/bannerNaera.xml
Line 44

[giordan]

I know. But the problem is that previewBanner is create dinamically by the previous lines. So...what's the problem??? Why previewBanner has no properties??? Why in IE work properly???

I don't see anything strange...
My only thought is that HTML added by Javascript isn't accessible by Javascript...bu t...I hope it's possible...

Or...maybe firefox don't insert HTML code contained in variable "testo" into opener page...but why do not should do that?

Uff...I hate Firefox!!!

Thank you all!

[acoder]

I know. But the problem is that previewBanner is create dinamically by the previous lines. So...what's the problem??? Why previewBanner has no properties??? Why in IE work properly???

In Firefox, the code appears like this (with indents):
[CODE=javascript]testo += '';
testo += '';
testo += '';
testo += '';
testo += '';
if(diff != 0){
testo += '';
}
testo += '';
testo += txtLarg + '';
testo += txtAlt;
testo += '';
testo += '';
testo += '';[/CODE]No wonder it doesn't work!

[drhowarddrfine]

In addition, your html contains attributes which do not exist. In one inline styling, you say "stile" instead of "style". Also, id names must be unique to one element on a page. You cannot use them more than once.

In your CSS, you have several properties that begin with a 's' so these do not exist.
Also, the values have no unit, such as px, specified.

Validate your html and css for those lists of errors.

Uff...I hate Firefox!!!

Never, ever use IE as a reference to how things should work. It is 10 years behind web standards, particularly the DOM. It is buggy and incomplete in its implementations . Always use a modern browser, such as Firefox, Opera or Safari to initially test your page. Then check in IE to adjust for its quirks and bugs.

[giordan]

Guys I've found the problem...
I don't know why but Firefox want that simbols "<" and ">" must be translated with "&lt;" and "&gt;", differently from IE.
In IE, writing &lt; or &gt; show "<" and ">" like no-code simbols.

Mah...Firefox.. .what a strange browser...

Thank you all!

[acoder]

Glad you managed to fix the problem.

Mah...Firefox.. .what a strange browser...

Have you tested in Opera, Netscape, Safari and others? You'll find, more often than not, that what doesn't work in Firefox won't work with the rest either.

[drhowarddrfine]

More appropriately, What works in all browsers most likely won't work in IE because it is non-standard or broken.

I hate to keep preaching that but until people understand that coding to IE is coding to a bug, they will constantly have questions as to why things don't work in the modern browsers.

Again, never, ever, ever use IE as a reference for how anything. should work.

[acoder]

More appropriately, What works in all browsers most likely won't work in IE because it is non-standard or broken.

My sentiments exactly, but not quite expressed in the same way!

My point was that code which "works in IE, but not in Firefox", most likely, will not work in other browsers either. This is usually because IE has a very inconvenient shortcut/quirk/bug which allows incorrect code to work. Conversely, what works in Firefox, more often than not with a few exceptions, will work in other browsers, but that is not always guaranteed for IE.

The strange browser is IE, not Firefox.

[giordan]

My opinion is different.
I work in a web agency, and we all hate Firefox.
I think: why "you" want to create a new browser and reduce the executed function?
An exaple: outerHTML doesn't work in firefox but work perfectly in IE.
Sometime happen that you are in a node, you want to select this node (I mean the HTML that comprises the node), but if you move to the parent node, you lost which node want to select. With outerHTML you can...but...in Firefox you can't...
And like that, other functionality, command or other doesn't work in firefox.
Some property like padding are managed more usefull in IE.
I've used IE, Firefox, Opera, Flock and now I'm using Maxthon. I can say that the best for me is Maxthon, based on IE.

I know, are opinions...
I think you're in accord with me if a say that web need a standard, an official standard.
What W3C say is not law! It's an advice!
If you write something nonstandard, your page will work...obiouvsl y, in some browser can make problems...

Thant's the principal problem! If there was a "law" to respect, all browser must parser html in the same way, without differences, and with more "relax" for developer.

Punch, kick and dirty words are allowed :-)

[drhowarddrfine]

My opinion is different.
I work in a web agency, and we all hate Firefox.

Because you are used to doing IE-only things.

I think: why "you" want to create a new browser and reduce the executed function?

Firefox is 10 years ahead of IE in functionality and Microsoft admits this.

An exaple: outerHTML doesn't work in firefox but work perfectly in IE.

There is no such thing as outerHTML. It is not standard and works only in IE.

Sometime happen that you are in a node, you want to select this node (I mean the HTML that comprises the node), but if you move to the parent node, you lost which node want to select. With outerHTML you can...but...in Firefox you can't...

IE does not support any DOM methods new since 1998. Firefox supports DOM methods up through 2004.

Some property like padding are managed more usefull in IE.

IEs handling of margins and padding are buggy at best and do not work to W3C standards like all other browsers do. Microsoft admits to their bugs there.

I can say that the best for me is Maxthon, based on IE.

Maxthon is just a wrapper around IE.

I know, are opinions...

No, it's fact. Microsoft, on their IEBlog, admits IE is far behind other browsers in support for modern standards and claims it is trying to catch up. Bill Gates even said IE8 will not have everything web developers want them to have.

I think you're in accord with me if a say that web need a standard, an official standard.
What W3C say is not law! It's an advice!

It's a 'recommendation ' by the people who created HTML and the world wide web but Microsoft is a dues paying member and supports their efforts.

If you write something nonstandard, your page will work...obiouvsl y, in some browser can make problems...

That is why there are standards and why is the most difficult browser to work with because it implements the standard worse than any other browser on the planet.

Thant's the principal problem! If there was a "law" to respect, all browser must parser html in the same way, without differences, and with more "relax" for developer.

Exactly! As stated above, IE is 10 years behind in this respect while ALL other browsers are reasonably current. As 'acoder' said, if something works in IE but not Firefox, you can be pretty sure your code has a problem with it.

There are hundreds of sites on the web dedicated to fixing IE but none used to fix other browsers. Two sites I recommend you and your company look at are positionisevery thing.net and webdevout.com. IE also has problems concerning 'haslayout' which changes IEs behavior if you don't write your html correctly, but I don't have that link available for reading (a long read).

You and your company need to learn to code to modern standards. IE is a bug. If you code using IE you are writing invalid, buggy code. You must use a modern browser to test in to detect these problems. Until you do, you will continue to always have issues. I can guarantee whatever you are having problems with in Firefox you are having the same issues in Opera, Safari, Konqueror and Epiphany; all much more modern browsers than IE ever will be.

[giordan]

Ehm...I've just seen the statistics of google analytics for the web site I made (www.naera.it.. .my first site) and there's no user using Epiphany, Konqueror or Opera. Modern browser but not used...
At most I have 57.95% IE/Windows, 33.52% FF/Windows, 2.84% Firefox/Macintosh, 1.70% Safari/Macintosh, 1.14% Firefox/Linux...
Opera is the worse browser I've tried.

[gits]

so even with that statistics you have more than 40% of users with 'other' browsers then IE ... so to give you a good reason to develop with FF for example is, that when coding to standards you often need slight adaptions to get it to work for IE too ... doing the opposite often leads to huge adaptions to make it work for all other browsers ... so it is not only a 'taste' of the programmer ... its a matter of productivity and better code-reuse ... that even could lead to better maintainability etc. ...

and one promise :) for javascript-development there is no better 'light' environment than FF with the firebug extension ... try it and you'll love it ... i promise ;)

kind regards