Drop down menu in nav-bar for ionic?

Is there a drop down menu in nav-bar for ionic? As the “Listen Now” in play music app.

Hi infero_19,

I implemented an drop down menu using basic css and html. Search on Google for a simple css menu, that will work just fine.


Kim could you provide a bit more info on what you did here. Did you create a template view and just display it on tap of the right button in the ion-navbar component?

Hi fburke,

Depends on your needs really. I just wanted a simple basic drop down with some links. I added the HTML inside the controllers leftButton object. On touch enabled devices the drop down will open with a click and stay open until the user presses it again so css only works fine here.

Code here: http://codepen.io/anon/pen/xjzwd


HI KIm can u pls update the codepen snippet…I am not able to see the output

@Calendee Any Ideas how to implement a dropdown menu like this ?

I have a pull request for $ionicDropdown: https://github.com/driftyco/ionic/pull/1333

demo: http://coderebelbase.github.io/ionic/

Use $ionicDropdown.fromTemplateUrl to create a dropdown, and dropdown.toggle or dropdown.show/hide to display.

It’s modeled based on $ionicModal, and supports the “dropdown-positive, dropdown-assertive, etc” color schemes.


Hi ilo, I saw your demo. It’s amazing. It’s something I’m looking for now. How could I get your code for a try?

Very nice Drop Down @ilo . This is pretty awesome. Can it do a “drop up”? Say you had stuff on the footer and tapped them. Would your current version try to drop-down or would it list the items above the footer?

your github link does not have anything

1 Like