[WSG] Submenu bug in FireFox...

[Mark Harwood]

Right, im playing with an Elastic Menu system built apon Nested ulli's

Now i know this would be frowned apon probelry! But im open to a better way in
doing it?

Anyway, back to my bug! On FireFox when you click on the Nav and it opens the
SubNav it Throws the Parents li 
Items out to the side! instead of dropping them down like it does in IE!

Now as im doing this in my new Every thing in EM's mode im finding it a little
tricky to work out!

so if you could have a gandar at
http://www.southtyneside.info/project_area/sharelearnimprove/old/layouttest.asp
and give us a hand at whats going wrong!

Also do you like the way it looks (in IE at least) shud be able to totaly
Increase and Decrease (by the time i finish!) 
it to any size!

Many Thanks
Mark Harwood
www.phunky.co.uk/2004/
*Currenly looking for Employment!*


*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
* 

Re: [WSG] Submenu bug in FireFox...

[Mordechai Peller]

Mark Harwood WebMail wrote:
Right, im playing with an Elastic Menu system built apon Nested ulli's
Now i know this would be frowned apon probelry! But im open to a better way in
doing it?
 

Semantically, a nested ul is correct.
Anyway, back to my bug! On FireFox when you click on the Nav and it opens the
SubNav it Throws the Parents li
ul {float : left;} means ALL UL's are floated left, including the nested 
ul. The nested ul is floated in it's parent li. The solution:

ul ul {float : none;}
Items out to the side! instead of dropping them down like it does in IE!
 

Sorry, but this may come as a surprise:  IE is getting it wrong.
Now as im doing this in my new Every thing in EM's mode im finding it a little
tricky to work out!
 

I find initially setting the body's font size to a percent, and then use 
em's. For everything else, it's either percent, em's, or px's (that's my 
usual order of preference).

Here's a way using JavaScript which works well. If JS is disabled it 
will still work by a trip to the server.

.closed ul {display : none;}
script type=text/javascript
function clicked(elem) {
 if (elem.parentNode.className == closed) {
   elem.parentNode.className = open;
 } else{
   elem.parentNode.className = closed;
 }
 return false;
}
/script

ul
 li class=opena href=... onclick=clicked(this)link1/a
   ul
 lia href=...sub1.1/a/li
 lia href=...sub1.2/a/li
   /ul
 /li
 li class=closeda href=... onclick=clicked(this)link2/a
   ul
 lia href=...sub2.1/a/li
 lia href=...sub2.2/a/li
   /ul
 /li
/ul
If JS is disabled, the links with the onclick work and it's up to the 
server to set what's open and what's closed. It's better to add the 
onclick's via external JS to fully separate behavior and presentation.
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
* 

Re: [WSG] Submenu bug in FireFox...

[Mark Harwood]

On Thu, 29 Jul 2004 14:44 , Mordechai Peller [EMAIL PROTECTED] sent:

ul {float : left;} means ALL UL's are floated left, including the nested 
ul. The nested ul is floated in it's parent li. The solution:

ul ul {float : none;}

Thank you thats the bit i missed!! Yeah i was thinking of doing it via JavaScript, 
but for now im just keeping it as taking you to the Project Intro first aswell 
as reveling the menu.

As this is internal only it dont matter too much bout how user's interface with it!

but thanks for the heads up!


*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help
*