[jQuery] Re: Superfish - modified Richard Willis

[Drew]

Joel,

It looks like you nailed it.  You can see the working menu here:
http://secure2.vqcdesigns.com/~hbgrc/

The only other issue I could find is that IE6 disregards the child
selectors for the active state on the main tabs, but that's obviously
not your doing.

I can't thank you enough for helping me put it all together the way I
wanted and for your continued support. I looked on the superfish site,
but couldn't find anything...do  you accept donations?

[jQuery] Re: Superfish - modified Richard Willis

[Joel Birch]

I'm really happy to hear that we solved this issue and that you are
pleased with the end result. I appreciate your offer of a donation,
but that's not necessary thanks all the same. Your issue helped to
solidify the pathClass feature so it was a good exercise - cheers!

Joel Birch.

[jQuery] Re: Superfish - modified Richard Willis

[Joel Birch]

One more suggestion to really hit your menu out of the park. Try
adding something like this type of thing:

.item62.sfHover  a {
background-image: url(../images/nav-regional-chamber-over.jpg);
}

...to your main tabs so that the 'active' look is applied to them.

Sorry I had to be brief as I need to go somewhere.

Joel Birch.

[jQuery] Re: Superfish - modified Richard Willis

[Drew]

Joel,

Sooo close.  That worked like a charm...however, once you actually
hover over the menu, the dropdowns are back to their old tricks and
the active dropdowns appear.  Is there any way you can think of around
this?  I assume this is all because of the pathClass.

Is it possible to achieve the desired effect without using the
pathClass at all?  I've tried changing the CSS so that the 2nd tier
will not be hidden, but nothing is working, so I assume something in
the javascript it overriding it.

Thanks for the continued help.

-Drew

[jQuery] Re: Superfish - modified Richard Willis

[Joel Birch]

Hi Drew,

Here is another quick patch I've worked out for you. Remove that other
line I gave you (the one that manually applies hideSuperfishUl on
document ready. Then alter the following line of Superfish.js:

CHANGE THIS:
o.$path = $('li.'+o.pathClass,this).each(function(){

TO THIS:
o.$path = $('li.'+o.pathClass+':first',this).each(function(){

That way, the path to restore only includes the submenu of the first
li that has the 'active' class, both on page load and mouseouts. This
limiting of the detected 'active' path seems like it may be the way to
go to provide flexibility to the pathClass feature so that these types
of menu are doable. I'll figure out a proper way of adjusting this
from the options object, but for now I hope this hack finally solves
the problem for you.

Joel Birch.

[jQuery] Re: Superfish - modified Richard Willis

[Drew]

Hi Joel,

Thanks a lot for taking the time to look into this.  Your solution
does stop the dropdowns from staying open, which was a problem, so
that's great.

Perhaps I didn't state the biggest problem clearly though...if you
actually click on a link from a dropdown, (for example, go to the
About Us page) that particular dropdown will be open when the page
loads.

I assume this is because the class active is assigned to that

Is there anything that can be done about this?

Thanks again.

On May 8, 12:17 am, Joel Birch [EMAIL PROTECTED] wrote:
 If the 'if' is removed from the out function, the menu almost works
 perfectly. The only downside is that the current second tier menu is
 'refreshed' when you mouseout rather than simply staying revealed. It
 disappears then animates back in as if it is being restored as it
 would if you moused out from a sibling non-current second tier menu.
 It may be an acceptable workaround for you though and it is far better
 than your current problem. Change the 'out' function to this:

 out = function(){
 var $$ = $(this), menu = getMenu($$);
 var o = getOpts(menu,true);
 clearTimeout(menu.sfTimer);
 menu.sfTimer=setTimeout(function(){
 $$.hideSuperfishUl();
 if (o.$path.length){over.call(o.$path);}
 },o.delay);

 },

 All I did there is remove the if statement. It's a hack, but until
 Superfish officially supports using pathClass with three tiered menus,
 this may have to suffice. I did try a few things to try and get a
 perfect result but it eluded me and I don't have as much time to spend
 on this as I used to unfortunately. I hope this workaround helps you
 out.

 Joel Birch.

[jQuery] Re: Superfish - modified Richard Willis

[Joel Birch]

Thanks Drew, sorry I overlooked that issue. Here's another hack to
solve that one. Add the following line inside your document ready
block, after the Superfish initialisation code:

$('ul.superfish li li').hideSuperfishUl();

That will close the last level of submenu. Sorry for another hacky
solution - I'll consider working on something more permanent. Good
luck.

Joel Birch.

[jQuery] Re: Superfish - modified Richard Willis

[Joel Birch]

Hi Drew,

If you remove the pathClass option, everything works fine. You don't
seem to be using that feature so it should not be in the options
object. Remove this line:
pathClass : 'active',

It looks like you could remove the bgIframe plugin also as you have
not included the intialisation code for it to work with Superfish
anyway. If you are using it elsewhere on the site then please
disregard this comment.

One more small thing: for better performance you should change the
selector in the Superfish initialisation from '.menu_topmenu' to
'ul.menu_topmenu'. That way jQuery only has to check the ul elements
for the class rather than every element in the DOM.

Good luck... pretty site!

Joel Birch.

[jQuery] Re: Superfish - modified Richard Willis

[Joel Birch]

Just as I hit send I realised that you are indeed wanting to use the
pathClass for the second tier of menu. The pathClass feature was only
ever tested to work with two tiers unfortunately, so it makes sense
that this bug exists. I'll have to have a think about what would be
required to make this work correctly and get back to you.

Joel Birch.

[jQuery] Re: Superfish - modified Richard Willis

[Joel Birch]

If the 'if' is removed from the out function, the menu almost works
perfectly. The only downside is that the current second tier menu is
'refreshed' when you mouseout rather than simply staying revealed. It
disappears then animates back in as if it is being restored as it
would if you moused out from a sibling non-current second tier menu.
It may be an acceptable workaround for you though and it is far better
than your current problem. Change the 'out' function to this:

out = function(){
var $$ = $(this), menu = getMenu($$);
var o = getOpts(menu,true);
clearTimeout(menu.sfTimer);
menu.sfTimer=setTimeout(function(){
$$.hideSuperfishUl();
if (o.$path.length){over.call(o.$path);}
},o.delay); 
},

All I did there is remove the if statement. It's a hack, but until
Superfish officially supports using pathClass with three tiered menus,
this may have to suffice. I did try a few things to try and get a
perfect result but it eluded me and I don't have as much time to spend
on this as I used to unfortunately. I hope this workaround helps you
out.

Joel Birch.