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：頁眉

回答

相關問題