Dropdown Menus / Nav about foundation-sites HOT 12 CLOSED

Wouldn't mind having that, though is it possible to include other ui frameworks / jquery with zurb foundation?

from foundation-sites.

They probably would - Foundation is pretty light. Where you might run into trouble is that very few frameworks have any responsive support, and foundation is all responsive.

from foundation-sites.

I really like foundation, and this feature is something that I would need. So I did some research and experimented a bit. You can find the experiment here or view it in action.

If this approach is okay, I'll take a stab at getting it ported into foundation.

from foundation-sites.

That's brilliant, definitely should add this to Foundation!

from foundation-sites.

Something like http://twitter.github.com/bootstrap/#navigation would be a grat addition to this already awesome framework. Hard to create responsive menus I would imagine

from foundation-sites.

I'd really like to see a drop-down menu added to Foundation as well. This is one big piece of functionality that is needed for every project. The idea of Foundation is to be able to quickly "wireframe" or "prototype" a site, but have it be automatically reformatted for mobile, and be production-quality code so the prototyping work is not wasted. I can't imagine too many websites that would be designed that wouldn't need a drop-down menu.

I totally get that this is a tricky issue when considering how to automatically reformat a drop-down menu for mobile. So I'm not even really asking for that, but for the desktop view we need it. Then we could use Frameworks ability to display or hide certain content based on mobile or not. i.e. Show the drop-down menu when not mobile, show a simpler set of links for a menu on mobile. Or show a single drop down menu on mobile that has just a few main links on it.

For example, if the desktop site menu is:
Home * News (Cat 1, Cat 2, Cat 3) * Portfolio (Cat 4, Cat 5) * About (About Us, Contact)

Then the mobile menu could simply be:
Home * News * Portfolio * About

... OR...

Menu (Home, News, Portfolio, About)

from foundation-sites.

Thanks for letting us know about this - we're actually working on several new elements, including this, even as we speak. We hope to have an update to Foundation in the next week or two that includes this as well as some other new prototyping elements. Thanks for getting in touch!

Jonathan Smiley
ZURB | Design Lead
[email protected]

408.540.8667

Build for Every Device
http://foundation.zurb.com

On Nov 7, 2011, at 7:24 AM, timnicholson wrote:

I'd really like to see a drop-down menu added to Foundation as well. This is one big piece of functionality that is needed for every project. The idea of Foundation is to be able to quickly "wireframe" or "prototype" a site, but have it be automatically reformatted for mobile, and be production-quality code so the prototyping work is not wasted. I can't imagine too many websites that would be designed that wouldn't need a drop-down menu.

I totally get that this is a tricky issue when considering how to automatically reformat a drop-down menu for mobile. So I'm not even really asking for that, but for the desktop view we need it. Then we could use Frameworks ability to display or hide certain content based on mobile or not. i.e. Show the drop-down menu when not mobile, show a simpler set of links for a menu on mobile. Or show a single drop down menu on mobile that has just a few main links on it.

For example, if the desktop site menu is:
Home * News (Cat 1, Cat 2, Cat 3) * Portfolio (Cat 4, Cat 5) * About (About Us, Contact)

Then the mobile menu could simply be:
Home * News * Portfolio * About

... OR...

Menu (Home, News, Portfolio, About)

---

Reply to this email directly or view it on GitHub:
#29 (comment)

from foundation-sites.

Awesome.

from foundation-sites.

I am using Foundation for a MODX CMS template I am working on called Flexibility and just added a drop-down menu.
You can preview it here:
http://designfromwithin.com/flexibility2

The code for the drop-down is here:
http://www.alessioatzeni.com/blog/css3-dropdown-menu/

My menu is responsive and I'm quite happy with it, but I still need a good way to handle the sub menu's on touch-screens...

from foundation-sites.

Hey Menno,
That's awesome - we're working on some similar elements on our end we're hoping to add to the Foundation base styles soon. For the dropdowns, the approach we've taken thus far has been to make the dropdown elements a modal dialog on small devices like phones (so the submenu appears as an overlay of the entire screen). You might try that out. Keep it up!

FTW
Jonathan

Jonathan Smiley
ZURB | Design Lead
[email protected]

408.540.8667

Build for Every Device
http://foundation.zurb.com

On Nov 10, 2011, at 1:42 AM, Menno Pietersen wrote:

I am using Foundation for a MODX CMS template I am working on called Flexibility and just added a drop-down menu.
You can preview it here:
http://designfromwithin.com/flexibility2

The code for the drop-down is here:
http://www.alessioatzeni.com/blog/css3-dropdown-menu/

My menu is responsive and I'm quite happy with it, but I still need a good way to handle the sub menu's on touch-screens...

---

Reply to this email directly or view it on GitHub:
#29 (comment)

from foundation-sites.

@ smileyj68 any rough ETA on this?

from foundation-sites.

Thanks for the great work on foundation!!
We're working on a Pinax theme based on foundation https://github.com/chrisdev/pinax-theme-foundation. The default Pinax theme is based bootstrap and there is a jquery mobile theme. For compatibility with Pinax we really need a top nav bar like http://twitter.github.com/bootstrap/#navigation. We are almost ready for our first release so we we decided to use the #zurBar from presentation.css on the foundation site. Are you guys any closer to releasing anything official in this area? I know that this is tricky since foundation is 100% responsive. The truth is that such a navbar should be probably only show on desktops for example, both google and twitter do no display the topnav on the phones i've tested them with

from foundation-sites.