How can I make submenu items from the superfish menu fly out to the left rather than to the right. Am using elevate on this site:
schoolvo.mysubname.com/

Hey Jelmar,

Ive noticed some other menus do it intelligrantly recently and I afraid to say our menu isnt that intelligent so it will require a hack and it will hack all of the menus to drop to the left.

So edit the menu css to attach a -ve margin-left value to this rule: #nav li ul

eg for Organica it wil be:

#nav li ul {position: absolute; width: 250px;background: #f9f9f9; z-index: 100000;margin-top: 0px;top: -9999px;border: 1px solid #ddd;border-width: 8px 1px 1px 1px}

Hoep that helps.

Anthony

Hey Anthony,

I am afraid I don't understand what you mean with a -ve margin-left (a negative pixelnumber?), and also I am not sure which file to edit. When I go to the menu.css of the superfish, the #nav li ul rule is not there.

Jelmar

Oh sorry which template is it for?

Anthony

Elevate 1

Thanks in Elevate1 you need to change the #topWrap li ul rule in the template_css.css file to:

#topWrap li ul {position: absolute; width: 248px;background: url(../images/menuOverlay.png); z-index: 100;top: -9999px;margin-left: -150px;}

That will position it 150px to the left.

Cheers Anthony

Thanks, that does position the menu that breaks out leftly, but the parent items they belong to stay in the same place. Here:
schoolvo.mysubname.com/

Ah ok try this :

#topWrap li ul ul {margin: 0 0 0 -495px}

Thats the rule directly underneath

Anthony

I had played around with this before. I have done what you said, but the menu does not seem to want to move:-(

Cache perhaps? It was working here for me when I manipulated the files.

Cache does have a way of caching one unawares. Not this time tho. It really does not go. I will send ftp details in a ticket?

Sure Ill check it in the morning - about to clock of now

If its urgent perhaps buzz Seth back here and he may take a look for you.

Anthony

Not urgent. Important, but not urgent:-) Thanks and sleep well.
Blessings,
Jelmar

Hmm, not certain this is the most 'elegant' way of doing this, but I moved you menu to the left modding this rule as highlighted (template_css.css line 42)

#topWrap ul {
background:url("../images/navSep.jpg") no-repeat scroll right 7px transparent;
float:left;
margin:0 0 0 -286px;
}

-286px aligns it (I think) with the image below. Of course, once you do that maybe you don't want your menus flying out to the left anymore?

Hi Seth,

Thanks. That DOES align the menu the way I want it. But after taking out the adjustments that Anthony suggested earlier, all my submenu items are now flying somewhere in browser limbo to the left.
What am I missing?

Jelmar

IMPORTANT UPDATE: my client has looked at the site and he does not want the menu to be on the left. So the question is back to where it started from: How can I get the menu items to break out to the left so they dont swim out of the screen.

Thanks,
Jelmar

Okay so far so good. The menu is back to the right where it belongs. And by applying this rule: #topWrap li ul ul {margin: 0 0 0 -495px} and the menu breaks out to the left. Problem now is that it looks so unnatural because the menus seem to appear from 'nowhere; rather than the item they are supposed to spring from. Is there any way to reverse this? Or maybe just statically flip into existence?

Hey Jelmar,

This actually requires a bit of hacking to the superfish.js and both Jeremy and Jason are away at the moment and they are the JS wizards. Id like to build the functionality into the dropdown so when they get back at the end of this week Ill get an idea on how to add this feature to the menu.

Thanks Anthony

Hey Anthony,

That would be great. I am away myself next week for teaching yoga in the french Alps. (My other job:-)
So no rush, want to get it live in the week thereafter.
Blessings,
Jelmar

Just added it to the todo list - Ive been meaning to look at it for ages.

Anthony