Question

我正在研究jQuery mobile。我有一个覆盖，弹出标题中的按钮弹出。叠加层显示在按钮附近。

<div data-role="header" data-position="fixed" data-theme="a" data-tap-toggle="false">
<h1>Photos</h1>
    <a href="#photomenu" data-icon="gear" data-iconpos="notext"
   data-rel="popup" data-transition="slidedown"></a>
 </div>

但是在方向更改时，叠加层会出现在中心位置。如何保持叠加在方向变化上的位置？任何帮助表示赞赏。

Answer 1

默认情况下，弹出窗口在您单击的对象（原点）上垂直和水平打开，这对于用作工具提示或菜单的弹出窗口很有用。该框架还应用了一些基本的碰撞检测规则，以确保弹出窗口出现在屏幕上，因此最终位置可能并不总是以原点为中心。

对于类似对话框或灯箱的情况，弹出窗口应显示在窗口的中心而不是原点，请将data-position-to属性添加到链接并指定window的值。

除了原点和窗口之外，还可以指定任何有效的选择器作为position-to的值。例如，如果添加data-position-to =“＃myElement”，则弹出窗口将位于具有id myElement的元素上。

<a href="#positionWindow" data-rel="popup" data-position-to="window">Position to window</a>

<div data-role="popup" id="positionWindow">
    <p>I am positioned to the window.</p>
</div>

我也为你制作了一个实时的jsfiddle例子：http://jsfiddle.net/Gajotres/8xCYB/

覆盖在jQuery mobile中的方向变化的位置

1 个答案: