W
www.raph.nl
Hi,
I'm in search of a JavaScript alternative for the 'child selector' in CSS.
This function is not supported by Internet Explorer and KHTML (but it is in
Safari...), so in practice it's near to useless.
What it's all about is the line in CSS (also see
www.raph.nl/test/test.css ):
#navigation ul li:hover>ul
So far I have found a nice DOM-and-Javascript solution which doesn't require
IDs and such for the tags that have to be manipulated, and transforms a
nested UL in a collapsible menu; this is a functionality I was looking for.
I've adapted the code, so collapsible menus are only made when they appear
in the DIV tag with the ID 'navigation'. The result is available on
www.raph.nl/test; in Mozilla and Opera 7 you'll see the CSS-only menu, in IE
the DOM menu is shown.
For me, a major disadvantage is that the script uses
document.createElement('a'), which causes a '>' to be shown in the menu. So
the look and feel of the CSS menu and the DOM menu are not equal.
I've tried to add an ONCLICK or ONMOUSEOVER attribute to the link directly
above the nested UL, or change the HREF value, but so far my efforts haven't
been succesful.
The result so far can be found in the file www.raph.nl/test/DOM-menu.js and
my trial for a solution can be seen in file www.raph.nl/test/DOM-menu2.js.
Mozilla and IE don't report errors, but it doesn't work either.
Does anyone know how this can be done?
Another question: with the insertBefore method, the JS-console reports that
two parameters are required, while according to
http://msdn.microsoft.com/library/d...thor/dhtml/reference/methods/insertbefore.asp
the second one is optional. Who's right here? And hinders only one attribute
the execution of the script in Mozilla?
with kind regards,
Raph
www.raph.nl
I'm in search of a JavaScript alternative for the 'child selector' in CSS.
This function is not supported by Internet Explorer and KHTML (but it is in
Safari...), so in practice it's near to useless.
What it's all about is the line in CSS (also see
www.raph.nl/test/test.css ):
#navigation ul li:hover>ul
So far I have found a nice DOM-and-Javascript solution which doesn't require
IDs and such for the tags that have to be manipulated, and transforms a
nested UL in a collapsible menu; this is a functionality I was looking for.
I've adapted the code, so collapsible menus are only made when they appear
in the DIV tag with the ID 'navigation'. The result is available on
www.raph.nl/test; in Mozilla and Opera 7 you'll see the CSS-only menu, in IE
the DOM menu is shown.
For me, a major disadvantage is that the script uses
document.createElement('a'), which causes a '>' to be shown in the menu. So
the look and feel of the CSS menu and the DOM menu are not equal.
I've tried to add an ONCLICK or ONMOUSEOVER attribute to the link directly
above the nested UL, or change the HREF value, but so far my efforts haven't
been succesful.
The result so far can be found in the file www.raph.nl/test/DOM-menu.js and
my trial for a solution can be seen in file www.raph.nl/test/DOM-menu2.js.
Mozilla and IE don't report errors, but it doesn't work either.
Does anyone know how this can be done?
Another question: with the insertBefore method, the JS-console reports that
two parameters are required, while according to
http://msdn.microsoft.com/library/d...thor/dhtml/reference/methods/insertbefore.asp
the second one is optional. Who's right here? And hinders only one attribute
the execution of the script in Mozilla?
with kind regards,
Raph
www.raph.nl