Skip navigation
Currently Being Moderated

Responsive Navigation: How? Best Method?

Sep 17, 2013 11:20 PM

Tags: #responsive_design #navigation_toolbar

I am novice trying to build first site, that is responsive design. I want to create a navigation that works on all platforms (desk,tablet, and mobile), but am unsure as the best way to go about doing this.

 

To create navigation I know of essentially three ways? :

 

  • Create (customize) a widget style navigation bar.
  • A html unordered list navigation
  • Create several divs all within a div (each for a menu item).

 

To avoid alot of frustration and time as a novice designer, does anyone have any suggestions for the best way to implement a navigation bar across all platforms?

 

Should I also consider using 'display none' in mobile CSS, and use a jquery menu somehow?

 

Thanks very much for any help.

 

Any advice for aligning a 'responsvie' footer would be appreciated.

 

http://forums.adobe.com/message/5691602#5691602

 
Replies
  • Currently Being Moderated
    Sep 18, 2013 12:13 AM   in reply to dreamweaver70

    You can implement this in your site:

     

    http://responsive-nav.com/

     

    http://jasonweaver.name/lab/flexiblenavigation/

     

    Just follow the instructions on the websites.

     

    I don't think your able as a novice to design something like this!

     

    Or if you want to spend $ 95 for a extension that spits it out in Dreamweaver where you want it:

     

    http://projectseven.com/products/menusystems/pmm3/index.htm

     
    |
    Mark as:
  • Currently Being Moderated
    Sep 18, 2013 11:30 AM   in reply to dreamweaver70

    I use a CSS styled list menu along with a free jQuery plugin called MeanMenu.

    You can see it working below:

    http://alt-web.com/FluidGrid/Fluid2.html

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Sep 18, 2013 1:01 PM   in reply to dreamweaver70

    Look at the demo.html file that came with your MeanMenu download.  You'll notice it uses <ul> and <li> tags as hooks for the CSS and JavaScript code.  So yes, you need to use a list menu.

     

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Sep 19, 2013 11:59 AM   in reply to dreamweaver70
    • I see no links to the jQuery core library
    • No links to MeanMenu.js
    • No links to MeanMenu.css
    • No list menus.
    • And no jQuery function codes.

     

    Maybe that's why your plugin doesn't work.

     

     

     

    Nancy O.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points