0

ポップアップ(Jquery Mobile)を使ってリストビューメニューを作ったのですが、ナビゲーションバーをクリックするとポップアップの位置が元に表示されてしまいました。リストビュー メニューをクリックすると、ドロップダウン メニューのようになります。CSS と JavaScript で位置を設定しましたが、表示には影響しませんでした。それで、表示位置をドロップダウンメニューのように見せるのを手伝ってくれる人はいますか？

スクリーンショットは次のとおりです。

画像メニュー

ドロップダウンのように見えるように、ポップアップをナビゲーションバーの下に配置する方法は?

CSSは次のとおりです。

div#popupMenu{
    float: left;
    max-width: 100%;
    min-height: 100%;
}

私もjavascriptを使用していますが、影響はありませんでした：

$( ".selector" ).popup( "open", x:0, y:200 );
4

1 に答える 1

1

私もポップアップの配置に苦労しています。このマークアップを使用して近づきました：

<!-- menu trigger -->
<a data-icon="gear"
   data-iconpos="notext"
   href="#menu"
   data-rel="popup"
   data-position-to="#menu-anchor"
   data-transition="slidedown">Menu</a>

<!-- menu position helper -->
<div id="menu-anchor"></div>

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

トリガーとメニューはどこにでも移動できます。ただし、アンカーはページの上部近くに配置する必要があります。jQM は の中心を の中心に揃えようとします#menuが#menu-anchor、アンカーが画面の上部にあるため、画面の上部に合わせて上部を揃えようとし、ほぼ期待どおりの結果が得られます。

デモはこちら

于 2013-03-02T21:03:30.197 に答える