JQueryMobile：页眉

下拉菜单我创建一个web应用JQM，需要下拉菜单添加到页眉达到以下效果JQueryMobile：页眉

---------------------------------- 
[Menu1] Page Title  [Menu2]  
----------------------------------

为JQM下拉小部件的任何例子吗？

来源

2012-02-24 Nirmal Patel

这里有一个jsFiddle有我写了这个代码。

Screenshot from JSFiddle

来源

2012-02-26 22:31:40

在1.7.1上尝试了这一点，它不起作用...格式根本不会聚集在一起...显示在机器人（LG Thrill）上。 – ppetree 2012-09-03 10:47:06

我的Galaxy S CM9在股票浏览器和Chrome中均可正常工作。 – 2012-09-03 15:09:54

有关基于jQuery Mobile内置选择菜单的示例，请参阅此jsFiddle。过去我不得不做这样的事情......它远非完美，并且可能无法在所有设备上正确呈现，但对我而言它确实可行。

enter image description here

来源

2012-02-26 01:02:55 Ryan

我不能使用选择控件的主要原因是我必须为菜单名称保留一个静态标签。选择控制;按钮中的文本会不断更新为当前选定的选项。 – 2012-02-26 20:18:02

好的。您应该将其添加到您的问题中，以便其他人可以将其考虑在内。您还可以使用jQuery覆盖选择操作，以便下拉菜单中显示的文本实际上不会改变。 – Ryan 2012-02-26 20:52:43

jQuery的移动1.2文档给使用弹出窗口小部件，用于从按钮创建菜单，而不是选择的一个示例：

http://jquerymobile.com/branches/popup-widget/docs/pages/popup/index.html

<a href="#popupMenu" data-rel="popup" data-role="button" data-inline="true" data-transition="fade">Menu</a> 

<div data-role="popup" id="popupMenu" data-overlay-theme="b"> 
    <ul data-role="listview" data-inset="true" style="width:180px;" data-theme="b"> 
     <li><a data-rel="popup" href="#popupMenuLevel1">Add</a></li> 
     <li><a data-rel="popup" href="#popupMenuLevel1">Edit</a></li> 
     <li><a data-rel="popup" href="#popupMenuLevel1">Manage</a></li> 
     <li><a data-rel="popup" href="#popupMenuLevel1">Delete</a></li> 
    </ul> 
</div> 

<div data-role="popup" id="popupMenuLevel1" data-overlay-theme="b"> 
    <ul data-role="listview" data-inset="true" style="width:180px;" data-theme="b"> 
    <li><a data-rel="popup" href="#popupMenuLevel2">Remove</a></li> 
    <li><a data-rel="popup" href="#popupMenuLevel2">Undo</a></li> 
    <li><a data-rel="popup" href="#popupMenuLevel2">Splice</a></li> 
    <li><a data-rel="popup" href="#popupMenuLevel2">Reticulate</a></li> 
    </ul> 
</div> 

<div data-role="popup" id="popupMenuLevel2" data-overlay-theme="b"> 
    <ul data-role="listview" data-inset="true" style="width:180px;" data-theme="b"> 
     <li><a href="index.html">Basics</a></li> 
     <li><a href="options.html">Options</a></li> 
     <li><a href="methods.html">Methods</a></li> 
     <li><a href="events.html">Events</a></li> 
    </ul> 
</div>

来源

2012-08-22 21:24:30 bluescrubbie

这是一个分支。它不包含在jquery移动版本中。如果您尝试使用上述任何一种方式，您需要从popup-widget分支获得jquery和jquery移动JavaScript库。 – Mervyn 2012-09-14 21:15:39

@Mervyn谢谢，奇怪为什么没有在文档中说明这是一个分支？ – Bula 2012-10-08 19:31:21

这个版本现在可以在1.2版本中使用。刚刚尝试过。没有分支需要。以上评论不再相关。 – scottheckel 2013-02-13 01:31:37

在JQuery的移动1.3这个问题有一个内置的示例。

http://view.jquerymobile.com/1.3.0/docs/widgets/popup/

<a href="#popupMenu" data-rel="popup" data-role="button" data-inline="true" data-transition="slidedown" data-icon="gear" data-theme="e">Actions...</a> 
<div data-role="popup" id="popupMenu" data-theme="d"> 
    <ul data-role="listview" data-inset="true" style="min-width:210px;" data-theme="d"> 
     <li data-role="divider" data-theme="e">Choose an action</li> 
     <li><a href="#">View details</a></li> 
     <li><a href="#">Edit</a></li> 
     <li><a href="#">Disable</a></li> 
     <li><a href="#">Delete</a></li> 
    </ul> 
</div>

来源

2013-03-25 21:23:11

，则应该设置在标题栏例如5个按钮，然后用于与下拉TRANSATION每个导航栏按钮中的一个弹出式菜单中设定导航栏格菜单。

来源

2016-04-15 06:39:56 negin51

JQueryMobile：页眉

回答

相关问题