www.webdeveloper.com
Results 1 to 4 of 4

Thread: Drop Down Menus

  1. #1
    Join Date
    Aug 2003
    Location
    Sydney, Australia
    Posts
    700

    Drop Down Menus

    I'm adding a fancier menu system to my CMS, and have bumped into a problem with drop down menus.

    The way the CSS is designed is that is has horizontal rows of DIVs, within which you can create colums (of DIVs) into which the content goes.

    That means you can put a menu anywhere on the page you like, and a page can have many menus if that's what you want on your web page. However, in looking at this drop down menu issue, that seems to create a problem.

    Let's say my first row is
    <div>Menu goes here</div>
    The second row is then
    <div>
    <div style='float:left; width:50%'>some content</div>
    <div style='float:left; width:50%'>some other content</div>
    <div style='clear:both'></div>
    </div>

    I'm looking at the drop menu solutions/tutorials on line, and what I suspect that when the menu drops down, it will expand the div in which it's encased, which will then move the next dive down. Obviously, that's not what I'm looking for.

    Can anyone suggest a way to create drop down menus so that they can still be encased in a div, yet can expand the actual menu without effecting the row below?

    Thanks CTB
    Oh Lord, please help me be the person my dog thinks I am.

  2. #2
    Join Date
    May 2005
    Location
    Gold Coast (MS)
    Posts
    2,214
    See if you can find one that works for you among these sites for navigation menus:

    CSS Library Horizontal CSS Menus: http://www.dynamicdrive.com/style/cs...y/category/C1/
    http://www.dynamicdrive.com/dynamicindex1/
    http://www.cssplay.co.uk/menus/
    How to Style an Unordered List with CSS:http://www.webreference.com/programm...le2/index.html
    Sexy Drop Down Menu w/ jQuery & CSS: http://www.noupe.com/tutorial/drop-d...query-css.html

    http://efuse.com/Design/navigation.html
    Simple JQuery Accordion menu: http://www.i-marco.nl/weblog/jquery-accordion-menu/
    Drop-Down Menus, Horizontal Style: http://www.alistapart.com/articles/horizdropdowns/

    NavDock jQuery Plugin (Ver 1.5.1): http://plugins.jquery.com/project/NavDock
    Making CSS Rollover Buttons: http://www.elated.com/articles/css-rollover-buttons/
    How to spice up your menu with CSS3: http://tympanus.net/codrops/2012/01/...enu-with-css3/

    How To:

    http://www.w3.org/TR/WCAG10-HTML-TECHS/#links
    http://www.creativepro.com/article/d...vigation-links
    http://efuse.com/Design/navigation.html
    Simple JQuery Accordion menu: http://www.i-marco.nl/weblog/jquery-accordion-menu/
    The Right Way to Make a Dropdown Menu: http://www.sitepoint.com/blogs/2009/...dropdown-menu/
    ------------------------
    Rounded Corner Menus:

    How to Create an Interactive Rounded Navigation Menu with CSS: http://www.wikihow.com/Create-an-Int...-Menu-with-CSS
    CSS Rounded Corners Menus: http://www.virtuosimedia.com/dev/css...-corners-menus
    How To Make CSS Expanding Rounded Navigation Menus & Buttons: http://www.amberweinberg.com/how-to-...menus-buttons/

  3. #3
    Join Date
    Aug 2003
    Location
    Sydney, Australia
    Posts
    700
    Thanks Major Payne. Much appreciated.
    Oh Lord, please help me be the person my dog thinks I am.

  4. #4
    Join Date
    May 2005
    Location
    Gold Coast (MS)
    Posts
    2,214
    You're very welcome.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles