javascript - jQuery Mobile - 如果选择输入，则固定标题更改大小

Question

我目前遇到一个固定 header 的奇怪问题。一旦我专注于输入字段，它就会变大，并且实际上“增长”到输入字段本身。每次我关注另一个输入字段时，它都会变大(例如，父 div 的填充会变大)

这是我正在使用的 HTML 标记

 <!-- Settings !-->
    <section id="settings" data-role="page" data-pagination="4" data-theme="a">
        <div data-role="header" data-position="fixed" data-tap-toggle="false">
        </div>
        <div data-role="content">
        </div>
         <div data-role="footer" data-position="fixed" data-tap-toggle="false" data-theme="a">
        </div>
    </section>

每次我关注我的输入字段时，“ui-fixed-header”类都会添加到标题本身。用 jQuery 删除它并没有带来预期的效果。大家有没有遇到类似的情况，你们是怎么解决的？

Answer 1

我通过覆盖某些 css 值解决了这个问题，如果选择了输入，这些值就会发生变化。以下是它对我的作用:

.ui-fixed-hidden{
    position: relative !important;
    top: 0 !important;
    padding: 0 !important;
}

.ui-header-fixed{
    position: fixed !important;
    top: -1px !important;
    padding-top: 1px !important;
}

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