I have a single-level css dropdown and wanted to add a delay, so I
setup superfish. It's working as I can see the animation when I mouse
over my menu, but the mouse delay isn't working. I think I need to add
the sfHover class somewhere into my css, but can't find exactly what I
need to change to get this working. I was using the demo CSS file as
an example but could not get it to work. Here's my CSS
#header #nav { position: absolute; list-style: none; right: 0px; top:
60px; background: #323232; }
#header #nav li { z-index:999; position: relative; padding: 0px 8px;
display: inline; text-transform: uppercase; font-size: 14px; line-
height: 30px; height: 30px; font-weight: bold; }
#header #nav li a { color: #ccc; text-decoration: none; }
#header #nav li a:hover { color: #fff; }
#header #nav li ul { position: absolute; top: -999em; background:
#323232; width: 175px; }
#header #nav li:hover ul { top: 17px; left: 0px; }
#header #nav li ul li { line-height: 24px; display: block; height:
24px; font-size: 10px; color: #fff; text-transform: uppercase; font-
weight: normal; border-bottom: 1px solid #444; }
#header #nav li ul li:hover { background-color: #393939; }
#header #nav li.superfish li:hover ul, #header #nav .superfish li
li:hover ul { top: -999em; }
nav is the id of my ul, and I'm implementing like this:
$(document).ready(function(){
$("ul#nav").superfish({
delay: 500,
speed: 'slow'
});
});
Any ideas?
