ns4,6,ie5,6 and mozilla

[Daniel]

I have this script and I want to adapt it to the DOM of most / all well
known browsers like mozilla and netscape.. at the moment it only works in
ie4+ en ns6. can anybody give me some hints ?!?
This is used for making a tree <li><ul>

var ns6 = document.getElementById && !document.all;
var ie4 = document.all && navigator.userAgent.indexOf("Opera") == -1;

function checkcontained(e)
{
var iscontained = 0;
cur = ns6 ? e.target : event.srcElement;
if (cur.id == "foldheader")
{
iscontained = 1;
}
else
{
while (ns6 && cur.parentNode || (ie4 && cur.parentElement))
{
if (cur.id == "foldheader" || cur.id == "foldinglist")
{
iscontained = (cur.id == "foldheader") ? 1 : 0;
break;
}
cur = ns6 ? cur.parentNode : cur.parentElement;
}
}
if (iscontained)
{
var foldercontent = ns6 ? cur.nextSibling.nextSibling :
cur.all.tags("UL")[0];
if (foldercontent.style.display == "none")
{
foldercontent.style.display = "";
cur.style.listStyleImage = "url(images/open.gif)";
}
else
{
foldercontent.style.display = "none";
cur.style.listStyleImage = "url(images/fold.gif)";
}
}
}

if (ie4 || ns6)
{
document.onclick = checkcontained;
}

[Lasse Reichstein Nielsen]

"Daniel" <dv*****@planet.nl> writes:

I have this script and I want to adapt it to the DOM of most / all well
known browsers like mozilla and netscape.. at the moment it only works in
ie4+ en ns6. can anybody give me some hints ?!?
Which browsers have you tried it in?
What error messages did they give?

Which browsers are you not supporting? E.g., not dinosaurs like
Netscape 4, where supporting it basically means writing two versions
of everything. It seems you are ignoring NS 4 (smart!).
This is used for making a tree <li><ul> var ns6 = document.getElementById && !document.all;
var ie4 = document.all && navigator.userAgent.indexOf("Opera") == -1;
The first hint is to *not* try to identify all existing browsers.

Browser detection is best saved for the situations where standards
break down, and where you know that a specific browser has a usable
workaround.
function checkcontained(e)
{
var iscontained = 0;
cur = ns6 ? e.target : event.srcElement;
My event handlers usually start out like this:

function checkcontained(event)
{
event = event || window.event; // IE sucks
var cur = event.target || event.srcElement; // IE sucks

(Yes, I always include the comments :)
There is no mention of "ns6" in this. It uses event.target if it is there,
no matter which, potentially unrecognized, browser is being used.
while (ns6 && cur.parentNode || (ie4 && cur.parentElement))
while ( cur.parentNode || cur.parentElement )

Again, don't detect the browser and assume the browser is the one
you think. Just test for the property you actually need. If it is
there, use it. If not, do something else. No need to know the name
of the browser for that.
if (cur.id == "foldheader" || cur.id == "foldinglist")
{
iscontained = (cur.id == "foldheader") ? 1 : 0;
Don't use "1" and "0" for boolean values. The language has "true" and
"false", and unless you are going to do arithmetic, you are just wasting
bits and processing power converting them to booleans later.

iscontained = (cur.id == "foldheader");
cur = ns6 ? cur.parentNode : cur.parentElement;
cur = cur.parentNode || cur.parentElement;

var foldercontent = ns6 ? cur.nextSibling.nextSibling :
cur.all.tags("UL")[0];
var foldercontent;
if (cur.nextSibling) {
foldercontent = cur.nextSibling.nextSibling;
} else if (cur.getElementsByTagName) {
foldercontent = cur.getElementsByTagName("ul")[0];
} else if (cur.all && cur.all.tags) {
foldercontent = cur.all.tags("UL")[0];
}

Object detection, not browser detection.
if (foldercontent.style.display == "none")
You should be aware that browsers as late as Opera 6 and Konqueror 3
don't allow you to change the display style dynamically. If you
support these, you might want to use visibility:hidden instead.
document.onclick = checkcontained;

If you really want to follow the DOM specification, use:

if (document.addEventListener) {
document.addEventListener("click",checkcontained,f alse);
} else if (document.attachEvent) {
document.attachEvent("onclick",checkcontained);
} else {
document.onclick = checkcontained;
}

Most of your exceptions are for IE, and most of these even for IE 4
(which is used less than Netscape 4). There are still points where
even IE 6 needs a helping hand, though.

Hope this helps.
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'

[Daniel van den Oord]

"Lasse Reichstein Nielsen" <lr*@hotpop.com> schreef in bericht
news:u1**********@hotpop.com...

"Daniel" <dv*****@planet.nl> writes:

I have this script and I want to adapt it to the DOM of most / all well
known browsers like mozilla and netscape.. at the moment it only works in

ie4+ en ns6. can anybody give me some hints ?!?
Which browsers have you tried it in?

Currenly I am trying this in Mozilla 1.4 and IE6
What error messages did they give?
IE6 doesn't give any errors..
NS6 gives the error that the foldercontent has no properties
Which browsers are you not supporting? E.g., not dinosaurs like
Netscape 4, where supporting it basically means writing two versions
of everything. It seems you are ignoring NS 4 (smart!).

I wanna support at least NS6, Mozilla and IE6 and maybe 5 the most common
used once...

var foldercontent = ns6 ? cur.nextSibling.nextSibling :

cur.all.tags("UL")[0];

var foldercontent;
if (cur.nextSibling) {
foldercontent = cur.nextSibling.nextSibling;
} else if (cur.getElementsByTagName) {
foldercontent = cur.getElementsByTagName("ul")[0];
} else if (cur.all && cur.all.tags) {
foldercontent = cur.all.tags("UL")[0];
}

Unfortunately this didn't work
The menu structure was very disturbed :(

>> stripped the rest.. :)

new code

//*******
// Still needing the next 2 lines :(
//*******
var ns6 = document.getElementById && !document.all;
var ie4 = document.all && navigator.userAgent.indexOf("Opera") == -1;

function checkcontained(variable)
{
if (typeof variable == 'undefined') variable = window.event;
var cur = (typeof variable.target != 'undefined') ? variable.target :
variable.srcElement;
var iscontained = 0;
if (cur.id == "foldheader")
{
iscontained = 1;
}
else
{
while ( cur.parentNode || cur.parentElement )
{
if (cur.id == "foldheader" || cur.id == "foldinglist")
{
iscontained = (cur.id == "foldheader");
break;
}
cur = cur.parentNode || cur.parentElement;
}
}
if (iscontained)
{

//*******
// Here it goes wrong
//*******
var foldercontent = ns6 ? cur.nextSibling.nextSibling :
cur.all.tags("UL")[0];
if (foldercontent.style.display == "none")
{
foldercontent.style.display = "";
cur.style.listStyleImage = "url(images/open.gif)";
}
else
{
foldercontent.style.display = "none";
cur.style.listStyleImage = "url(images/fold.gif)";
}
}
}

if (document.addEventListener)
{
document.addEventListener("click",checkcontained,f alse);
}
else if (document.attachEvent)
{
document.attachEvent("onclick",checkcontained);
}
else
{
document.onclick = checkcontained;
}

[Lasse Reichstein Nielsen]

"Daniel van den Oord" <da*******@planet-maps-on.nl> writes:

NS6 gives the error that the foldercontent has no properties
Ok, that probably means that foldercontent is null or undefined.
I wanna support at least NS6, Mozilla and IE6 and maybe 5 the most common
used once...
Aiming for standards should give you Mozilla and Netscape 7 (and
Netscape 6 if you avoid the bugs ... it is based on a pre-1.0
version of Mozilla and has some bugs)

var foldercontent = ns6 ? cur.nextSibling.nextSibling :

cur.all.tags("UL")[0];

var foldercontent;
if (cur.nextSibling) {
foldercontent = cur.nextSibling.nextSibling;
} else if (cur.getElementsByTagName) {
foldercontent = cur.getElementsByTagName("ul")[0];
} else if (cur.all && cur.all.tags) {
foldercontent = cur.all.tags("UL")[0];
}

Unfortunately this didn't work
The menu structure was very disturbed :(

Thinking about it, it is not that supricing. The oringinal expression
didn't make much sense either:

var foldercontent = ns6 ? cur.nextSibling.nextSibling :
cur.all.tags("UL")[0];

If it is NS6, you let foldercontent be a sibling of the cur node. That
is, they are nodes on the same level, having the same parent node.
If it is not NS6, you find a child node of the cur node.

So, which is it? Without knowing the structure of the HTML it is hard
to guess which it should be, but since it works in IE, the problem is
probably the nextSibling part. I would just skip it and use:

var foldercontent;
if (cur.getElementsByTagName) {
foldercontent = cur.getElementsByTagName("ul")[0];
} else if (cur.all && cur.all.tags) {
foldercontent = cur.all.tags("UL")[0];
}

That should at least do the same thing in both Mozilla and IE.

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'

[Daniel van den Oord]

"Lasse Reichstein Nielsen" <lr*@hotpop.com> schreef in bericht
news:fz**********@hotpop.com...

"Daniel van den Oord" <da*******@planet-maps-on.nl> writes:

NS6 gives the error that the foldercontent has no properties
Ok, that probably means that foldercontent is null or undefined.

I wanna support at least NS6, Mozilla and IE6 and maybe 5 the most common used once...

Aiming for standards should give you Mozilla and Netscape 7 (and
Netscape 6 if you avoid the bugs ... it is based on a pre-1.0
version of Mozilla and has some bugs)

I know I'm trying to keep things save... I allready made a lot of
workarounds in other scripts
most of them to ugly to show though ;)

> var foldercontent = ns6 ? cur.nextSibling.nextSibling :
cur.all.tags("UL")[0];

var foldercontent;
if (cur.nextSibling) {
foldercontent = cur.nextSibling.nextSibling;
} else if (cur.getElementsByTagName) {
foldercontent = cur.getElementsByTagName("ul")[0];
} else if (cur.all && cur.all.tags) {
foldercontent = cur.all.tags("UL")[0];
}
Unfortunately this didn't work
The menu structure was very disturbed :(

Thinking about it, it is not that supricing. The oringinal expression
didn't make much sense either:

var foldercontent = ns6 ? cur.nextSibling.nextSibling :
cur.all.tags("UL")[0];

You got that right it never worked here ;)

If it is NS6, you let foldercontent be a sibling of the cur node. That
is, they are nodes on the same level, having the same parent node.
If it is not NS6, you find a child node of the cur node.

So, which is it? Without knowing the structure of the HTML it is hard
to guess which it should be, but since it works in IE, the problem is
probably the nextSibling part. I would just skip it and use:

var foldercontent;
if (cur.getElementsByTagName) {
foldercontent = cur.getElementsByTagName("ul")[0];
} else if (cur.all && cur.all.tags) {
foldercontent = cur.all.tags("UL")[0];
}

That should at least do the same thing in both Mozilla and IE.

Well I wished still nothing in foldercontent...

I'm sorry I totally forgot about the html code ;) here it is.. partially ;)

<div style="position:relative;left:-24">
<ul>
<li id="foldheader"> Modulen</li>
<ul id="foldinglist" style="display:none" style=&{head};>

<li id="foldheader"> Gebruikers</li>
<ul id="foldinglist" style="display:none" style=&{head};></ul>

<li id="foldheader"> Modulen</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a
href="javascript:menulinks('ed8019657149212393e5bf 995c2c9431')">
Install</a></li>
</ul>

<li id="foldheader"> Servers</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a
href="javascript:menulinks('e4f2e95c8f850458f86a26 4bf792d0e8')">
IP-adressen</a></li>
<li><a
href="javascript:menulinks('11066639b238708c841da0 06e1166dda')">
Locaties</a></li>
<li><a
href="javascript:menulinks('3e8c653b2ee35059fc0a94 d568953238')">
Servers</a></li>
<li><a
href="javascript:menulinks('1ce826ae5f9dbd78c19cab 92da1f3330')">
Software</a></li>
<li><a
href="javascript:menulinks('e7d0cc30504eaa9be0f21e 394370c217')"> Type
Software</a></li>
</ul>
<li><a
href="javascript:menulinks('e1c31bf61d993792517307 5207517770')"> Quick
Links</a></li>
</ul>
</ul>
</div>

[Lasse Reichstein Nielsen]

"Daniel van den Oord" <da*******@planet-maps-on.nl> writes:

Well I wished still nothing in foldercontent... I'm sorry I totally forgot about the html code ;) here it is.. partially ;)

<div style="position:relative;left:-24">
<ul>
<li id="foldheader"> Modulen</li>
<ul id="foldinglist" style="display:none" style=&{head};>

Ok, have you ever validated this code? (Hint: it won't)

You are not allowed to have ul elements as direct children of other ul
elements. They must be inside an li element.
That is, a menu item is something like

<li>Modulen
<ul>
...
</ul>
<li>

The submenu of Modulen is inside the same li element as the title.

If written like that, the getElementsByTagName/all.tags code should
find the submenu correctly.
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'

[Daniel van den Oord]

"Lasse Reichstein Nielsen" <lr*@hotpop.com> schreef in bericht
news:7k**********@hotpop.com...

"Daniel van den Oord" <da*******@planet-maps-on.nl> writes:

Well I wished still nothing in foldercontent...

I'm sorry I totally forgot about the html code ;) here it is.. partially ;)
<div style="position:relative;left:-24">
<ul>
<li id="foldheader"> Modulen</li>
<ul id="foldinglist" style="display:none" style=&{head};>

Ok, have you ever validated this code? (Hint: it won't)

You are not allowed to have ul elements as direct children of other ul
elements. They must be inside an li element.
That is, a menu item is something like

<li>Modulen
<ul>
...
</ul>
<li>

The submenu of Modulen is inside the same li element as the title.

If written like that, the getElementsByTagName/all.tags code should
find the submenu correctly.

HEhe I allready was very confused with the code.... Now I know why....
Thanks a lot men... thanks a bunch