Question

我是jQuery和移动应用程序的新手。

我对一个名为nativeDroid的jQuery主题有一个恼人的问题。将表单添加到我的页面后，每当我点击表单（常规输入或textarea）时页眉和页脚更改其位置并拉伸页面宽度。似乎在单击文本字段时，另一个类被添加到标题div中。类名是.ui-fixed-hidden。

我查看了一个完全相同的问题here，但解决方案并不适用于我。我尝试更改.ui-fixed-hidden类，以便它匹配给定的解决方案但是问题依然存在。如果有人可以帮助我，我会非常感激，因为它会放弃像这样一个看起来很棒的主题是一种耻辱。

我无法发布任何图片，但问题看起来与我添加的帖子中的问题相同。

有人可以帮帮我吗？

Answer 1

我正在使用PrimeFaces 5.0最终版本，这意味着我正在使用jQuery Mobile 1.4.2。

我按照此处的推荐添加了data-tap-toggle =“false”（此处有关于stackoverflow的许多其他问题），但这并没有解决我的问题。

<div data-role="header" data-position="fixed" data-tap-toggle="false">

所以，我还添加了以下内容，这解决了我的问题。

.ui-header.ui-fixed-hidden {
    position: fixed !important;
}

Answer 2

添加data-tap-toggle =＆＃34; false＆＃34;

例如，我在这个标题中使用过，并为我工作：

<div data-role="header" data-position="fixed" style="height:87px" data-tap-toggle="false">
    <a href="#grid-menu" class="botonHeader" data-theme="b" data-icon="home">Home</a>
    <h3>Contact</h3>
    <img src="objetos/logo_48.jpg" class="ui-btn-right logoHeader"/>
</div>

这与点击切换功能有关。当你点击页面时，我们设置position：absolute;而不是固定的工具栏。您会在此页面上注意到此行为包含更多内容：http://jsbin.com/erezak/25 因此有意删除/添加该类。如果你不想这样，你可以设置data-tap-toggle =＆＃34; false＆＃34;。

问题是我们将固定页脚1px下调以解决Android上的1px间隙问题。我们还设置1px padding-bottom以保持相同的视觉高度。当我们切换到position：absolute时，这会导致文本跳转1px;在一个短页面（没有滚动）

其他问题是边框在position：fixed;处不可见，但在position：absolute;

时变为可见

参考：https://forum.jquery.com/topic/ui-fixed-hidden-on-click-event-1-1-rc2

使用表单时，jquery mobile中的页眉和页脚高度会发生变化

2 个答案: