problem persistent; sfhover - nested menu - hovering problem

[mogwaii]

I really can't find the problem, still i believe it is somwhere in
added LI links, supposing in stylesheets are missing some new LI
values for hovering, although it is very difficult to discern which
ones. I got this patch and the "nesting" script from an old friend
which now lacks the time to help me again. I have the same site in
backup in which all is working fine, but here some error is showing
when hovering over the elements(IE6. is showing that error).

IE8, Opera and Firefox working well with this nesting "script" so i
guess this patch couls set sails. Anybody please in the name of the
Santa Claus !!?

<script type="text/javascript">
//MSIE 6 and under hack for lack of CSS LI rollovers
var sfHover = function() {
var sfEls =
document.getElementByid("meni").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls.onmouseover=function() {
this.className+=" sfhover";
}
sfEls.onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"),
"");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

</script>



CSS PART

#meni {
font-size: 15px;
margin:10px -5px 5px -3px;
}

#meni ul {
margin: 0;
padding: 0;
list-style: none;
position: relative; width: 150px;
background:#F0F8FF;

}

/* secondary menu color */
#meni ul ul { background: #dde; }

/* tertiary menu color */
#meni ul ul ul { background: #ffe; }


/* make LI and A block so fill width 100% */
#meni ul li, #meni ul a { display: block; }

/* Just put border on LI to make grid */
#meni ul li { border: 1px solid #888; }

#meni a { text-decoration: none; padding: 2px; }

/* hide the nested menus just push out of sight to hide */
#meni li ul {
position: absolute;
left: -999em;
margin-left: 140px;
margin-top: -1.6em;
}

#meni li ul ul {
left: -999em;
}

#meni li:hover,
#meni li.sfhover {
background:#dde;
}

#meni li a:link,
#meni li a:visited {
display: block;
width: 140px;
color: #6495ED;
background-color: transparent !important;
}

#meni li a:hover,
#meni li a.sfhover,
#meni li a:active {
color: #6495ED; /* current link glow */
}

#meni li:hover ul ul,
#meni li:hover ul ul ul,
#meni li.sfhover ul ul,
#meni li.sfhover ul ul ul {
left: -999em !important; /* drop sibling's childs back */
background-color: #F0F8FF;
}

#meni li:hover ul,
#meni li li:hover ul,
#meni li li li:hover ul,
#meni li.sfhover ul,
#meni li li.sfhover ul,
#meni li li li.sfhover ul {
left: auto; /* lists nested under hovered list items */
background-color:#F0F8FF;
}




#kvartovi{
position: absolute;
margin-top: 20px;
}

#kvartoviposition {
position: relative;
margin-left: 10px;
}

#kvartovilinks {
margin-top: -10px;
margin-left: -15px;

}

#kvartovilinks a {
color: #6495ED;
}
#kvartovilinks a:hover {
font-weight: normal;
}


HTML PART, example for Added LI links


<li><a href="#">&nbsp;&nbsp;&nbsp;Novi Zagreb
»»»»»</a>
<ul>
<li><a href="http://www.novi-zagreb.info"
target="_blank">&nbsp;&nbsp;&nbsp;Novi Zagreb</a></li>
<li><a href="http://www.zagreb.hr/default.aspx?id=153"
target="_blank">&nbsp;&nbsp;&nbsp;Novi Zagreb - Istok(g.è.) </a></li>
<li><a href="http://www.travno.hr/"
target="_blank">&nbsp;&nbsp;&nbsp;Travno </a></li>
<li><a href="http://www.zagreb.hr/default.aspx?id=154"
target="_blank">&nbsp;&nbsp;&nbsp;Novi Zagreb - Zapad(g.è.) </a></li>
<li><a href="http://www.laniste.net/"
target="_blank">&nbsp;&nbsp;&nbsp;Lani¹te </a></li>
</ul>
</li>

 

[Adrienne Boswell]

Gazing into my crystal ball I observed mogwaii <[email protected]>
writing in 32g2000yqz.googlegroups.com:

<li><a href="http://www.novi-zagreb.info"
target="_blank">&nbsp;&nbsp;&nbsp;Novi Zagreb</a></li>

Two things:

1. Why the &nbsp; ? Use left padding on the li instead.
2. Why the target="_blank"? I hate that, especially from a main menu.
If something HAS TO open in a new window/tab, at least give the visitor
some kind of indication - use the title attribute or put a notice
somewhere visible that links are going to open in new windows/tabs.

As to your OP, URL?

 

[dorayme]

<[email protected]

,

I really can't find the problem, still i believe it is somwhere in
added LI links, supposing in stylesheets are missing some new LI
values for hovering, although it is very difficult to discern which
ones. I got this patch and the "nesting" script from an old friend
which now lacks the time to help me again. I have the same site in
backup in which all is working fine, but here some error is showing
when hovering over the elements(IE6. is showing that error).

IE8, Opera and Firefox working well with this nesting "script" so i
guess this patch couls set sails. Anybody please in the name of the
Santa Claus !!?

<script type="text/javascript">
//MSIE 6 and under hack for lack of CSS LI rollovers
var sfHover = function() {
var sfEls =

You would not *need* to find the problem if you made your
dropdown menu in such a way that it does not matter if it drops
down or not. And this is exquisitely so if the only browser in
which it does not is IE6.

Generally, Suckerfish type menus work well without the js, the
shover being to latch a bit of js on for IE6. But if you make the
top menu item a link (the top menu item is the one that is always
visible) go to a page that has asa local menu all the dropdown
items under it, no user is really disadvantaged.

I had a nice working dropdown recently but there was a problem
with the js and shover and it was relief to know that it did not
matter that I find the time to sort it out because I had already
made the provision mentioned above and in some ways, it was
better, more natural looking and less fiddly in IE6 (where the
drop was not working)!