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 回答