user1448031
user1448031

Reputation: 2166

jQuery Mobile: How to create a dropdown menu when an icon is clicked?

I have an icon in the header. When the icon is clicked, I'd like to show a dropdown menu. When an element of the dropdown menu is clicked, it fires the action but the icon should not be replaced by the selected element. In other words, the icon is always displayed regardless of what's selected from the list. Is there a built-in functionality for this in jQuery Mobile or some other way to achieve this?

Upvotes: 1

Views: 3768

Answers (1)

Alex Howansky
Alex Howansky

Reputation: 53533

Have the href for the button refer to the id of a popup div:

<a href="#menu" data-role="button" data-rel="popup">Menu</a>

Then create a popup div that contains a list:

<div id="menu" data-role="popup">
    <ul data-role="listview" data-inset="true">
        <li><a href="whatever">selection 1</a></li>
        <li><a href="whatever">selection 2</a></li>
    </ul>
</div>

Upvotes: 2

Related Questions