Thread: CSS Sub Menu's

    #1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2008
    Location
    Calgary, Alberta, Canada
    Posts
    17
    Rep Power
    0

    CSS Sub Menu's


    I'm looking to create menu's similar to wsm dot com's index's menu's which unfold sub menu's on them in css. Does anybody in here have any sites that have CSS dynamic menu's like that which are to w3 markup standard and indexable/compliant with google search engine code? I've been reading a lot of articles that suggest that the common java menu's don't often allow spyders to properly index internal site links appropriately. I haven't found any CSS sub menu drop down menus that are what I'm looking for any sites so if you could help I'd be greatful. Keep in mind they must meet w3 markup standards and work to index appropriately with google.

    Thanks in advance,

    Adam J H
  2. #2
  3. /* Spawn Killer Killer */
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Nov 2004
    Location
    New Orleans, LA, USA
    Posts
    1,224
    Rep Power
    220
    Check out this site for an example of what you may be looking for. It also provides External links for more information.

    Having fully CSS implemented drop down menus won't work because you need to support older browsers like IE6 that don't support the :hover pseudo-class. Javascript is needed to fully make it work on all borwsers.
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2008
    Location
    Calgary, Alberta, Canada
    Posts
    17
    Rep Power
    0
    Originally Posted by flashbck
    Check out for an example of what you may be looking for. It also provides External links for more information.

    Having fully CSS implemented drop down menus won't work because you need to support older browsers like IE6 that don't support the :hover pseudo-class. Javascript is needed to fully make it work on all browsers.

    I guess the sitemap will have to be the defining factor on the site to make it properly indexable then. I'd love to find some menu's that are a little more fancy but at the same time spyder readable. Is it possible to combine the CSS with the js to give a nicer cascading menu where it highlights each as it goes over? I've seen it but I need something a little more "Styled". Thanks again
  6. #4
  7. /* Spawn Killer Killer */
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Nov 2004
    Location
    New Orleans, LA, USA
    Posts
    1,224
    Rep Power
    220
    Originally Posted by AdamJH
    I guess the sitemap will have to be the defining factor on the site to make it properly indexable then. I'd love to find some menu's that are a little more fancy but at the same time spyder readable. Is it possible to combine the CSS with the js to give a nicer cascading menu where it highlights each as it goes over? I've seen it but I need something a little more "Styled". Thanks again
    You can build a complete menu using <ul> and <li> and it will be fully indexed by a search engine using the Suckerfish method that I mentioned. The reason that some javascript methods do not get indexed is because the submenu is generated on the fly using the DOM so when the spider crawls your site, the submenu hasn't been created yet. Using CSS and javascript together will allow for the submenu to exist, but you simply use styles to make the display property be none. The javascript is only used to make the submenu visible to your user.
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2008
    Location
    Calgary, Alberta, Canada
    Posts
    17
    Rep Power
    0

    Thumbs up


    Originally Posted by flashbck
    You can build a complete menu using <ul> and <li> and it will be fully indexed by a search engine using the Suckerfish method that I mentioned. The reason that some javascript methods do not get indexed is because the submenu is generated on the fly using the DOM so when the spider crawls your site, the submenu hasn't been created yet. Using CSS and javascript together will allow for the submenu to exist, but you simply use styles to make the display property be none. The javascript is only used to make the submenu visible to your user.
    Thank you!
  10. #6
  11. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    Don't assume that because examples aren't very fancy that you can't use the same techniques to achieve what you want.

    Originally Posted by flashbck
    Having fully CSS implemented drop down menus won't work because you need to support older browsers like IE6 that don't support the :hover pseudo-class. Javascript is needed to fully make it work on all borwsers.
    To clarify, IE5-6 only support :hover on <a> elements.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).

IMN logo majestic logo threadwatch logo seochat tools logo