0

我正在开发 jQuery 移动版。我有一个覆盖,点击标题中的一个按钮就会弹出。覆盖显示在按钮附近。

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

但是在方向改变时,覆盖出现在中心。如何在方向更改时保留叠加层的位置?任何帮助表示赞赏。

4

1 回答 1

0

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

对于像对话框或灯箱这样的情况,弹出窗口应该出现在窗口的中心而不是在原点上,将 data-position-to 属性添加到链接并指定 window 的值。

除了 origin 和 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/

于 2013-02-12T09:56:45.417 回答