4 replies [Last post]
bethanywatson
Offline
Regular
WV
Last seen: 12 years 13 weeks ago
WV
Joined: 2008-06-07
Posts: 13
Points: 0

Can anyone help me out with this...

I would like arrow_right.gif to show up when there are child levels under the parents. For example when you mouseover services, it should have the arrow. When you mouse over business strategy it should show the arrow...and so on. IS there a specific or standard CSS code for this to show? I have seen different code being used, but I can't get it to work..

Also, I need help in fixing the third sublevel. On "Enterprise Cost Reduction" you will notice when you mouseover it shows the sublevels, but they start adjacent to "Business Startegy" It is almost impossible to get to the "Shared Services" link without the whole menu disappearing. How do I make it flyout to the right, next to "Enterprise Cost Reduction"?

URL is http://www.bethanyann.com/bluewater

Thanks so much,
Bethany

Stomme poes
Stomme poes's picture
Offline
Elder
Netherlands
Last seen: 8 years 51 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2008-02-04
Posts: 1854
Points: 378

For an arrow gif, I'd give

For an arrow gif, I'd give everyone who should have an arrow a class. If you only want the arrow to show on :hover then have background-image on the li in question be set to none, and on :hover, background: color url(arrow.gif) position position no-repeat; That's what I'd do anyway.

You menu is set up a bit differently, as usually each li is a parent of its own sub. Again I have trouble seeing how you've set it up, but the positioning of each child ul is relative to its parent... at least, that's what you want. Not relative to the main menu. That last layer of menu should have a different coordinate set for top than the others... since you've given each layer a name (id or class), you should be able to target just that one, and say top:0 in relative not to the main menu but to its direct parent, the li above it.

  • Usually, #main is set to position: relative, so the subs know who to line up in relation to... the li's a re floated left, and sometimes can have a pos: rel as well.
    The normal subs, you say
    ul ul {
    position: absolute;
    set coords here, blah
    }
    ul ul li {
    pos: rel might do it, though the ul ul is already abso-po'd so it should set the relation
    }
    And then for the sub-subs:
    ul ul li #funky { (or just ul ul li ul since we don't really need names here)
    position: absolute;
    }
    this is now in relation to the li of the first submenu. It should be that if you set the top coord to 0, it should be the same as the top of the sub li, not the main menu...

    Hmmm, if you want you can take a look at my barebones IE7-friendly suckerfish?
    http://stommepoes.nl/Menus/barebonessuckerfish.html css: http://stommepoes.nl/Menus/barebones.css
    You can see what I used to position the sub subs (I have one sub layer and a sub sub layer : )

    Lastly, you are seriously making life harder in regards to IE... by setting that "xml prologue" (<?xml blah blah?> stuff) before the doctype, you are setting IE into quirks mode... meaning it's acting like IE5.5 and below... meaning, it's assuming you have NO doctype at all! Silly IE...
    You don't need that anyway. Not every xml document needs it, and even so, your XHTML page is being sent from the server as text/html (otherwise IE wouldn't even open it!) and so you really just have normal HTML, not true XML.

    So, delete it. I know you can see it on many other pages... these pages often have a special IE-only css sheet because the writers didn't know why IE was behaving so especially badly : )

    I'm no expert, but I fake one on teh Internets

    bethanywatson
    Offline
    Regular
    WV
    Last seen: 12 years 13 weeks ago
    WV
    Joined: 2008-06-07
    Posts: 13
    Points: 0

    Stumped

    Hi There,

    I have tried to do what you suggested with top:0; but think I am doing this all wrong...maybe putting it in the wrong place. This is for a Joomla drop down menu and is being used with the extended menu module. Are you familiar with Joomla at all? Can you give me a little more specific details on what and where I should put the code? I am a newbie to suckerfish menus. I copied the code from somewhere, can't even remember now, and then modified it to look how I wanted. I don't want to start over from scratch.

    Thanks,
    Bethany

    Stomme poes
    Stomme poes's picture
    Offline
    Elder
    Netherlands
    Last seen: 8 years 51 weeks ago
    Netherlands
    Timezone: GMT+2
    Joined: 2008-02-04
    Posts: 1854
    Points: 378

    Eh, menus are pretty

    Eh, menus are pretty complicated and I easily could be off with top: 0... trying to visualise it while I type.

    I could try to replicate your menu but in a Suckerfish way, and see if I can get it working... the thing is, somewhere you DO have the code to make the dropdowns start at the level of their parent (that the dropdown of the second item starts no higher than the second item, etc), because all your other levels are doing it!

    Suckerfish menus are nice in that they are pretty clear code-wise (for a drop-down menu... drop downs are just always big piles of code).

    Unfortunately I know nothing of Joomla (although for a template system is it has a pretty good reputation) but the principles can't be all that different.

    Were you able to get the arrows going?

    I'm no expert, but I fake one on teh Internets

    bethanywatson
    Offline
    Regular
    WV
    Last seen: 12 years 13 weeks ago
    WV
    Joined: 2008-06-07
    Posts: 13
    Points: 0

    Started Over

    HI there,

    Thanks for your quick reply. I actually decided to start over with new code. If you look at it now you will see that the menu is generated with different code now and html, instead of dynamic html from Joomla..not the idea way to do it with Joomla, but it will work I think. The arrows are working. The only thing that I don't like is the dropdowns aren't going out straight to the left on some of the lower sublevels. Any idea what could be wrong?

    Thanks,
    Bethany