0

jQuery mobile phonegap アプリケーションにページがあり、奇妙な動作をします。本文(コンテンツ)をクリックするたびに、ヘッダーが高さで増加します。要素を調べると、クリックに応じて H1 タイトルが右と下に移動し、左側のアイコンからの距離が大きくなっているようです。jquery mobile 1.3.2 とnativeDroid 2.2.0を使用しています。私のコードは次のとおりです。

<div data-role="page" id="feedbackPage" data-theme="b">

    <div data-role="header" data-theme="b" data-position="fixed">
        <h1>Feedback</h1>
        <a href="#feedbackPagePanel" data-icon='reorder' data-iconpos="notext"></a>
    </div>
    <div data-role="content">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
        <form>
            <textarea cols="40" rows="8" name="feedback" id="feedback"></textarea>
            <button type="submit" name="submitfeedback" id="submitfeedback">Send</button>
        </form>
        </p>
    </div>

    <div data-role="panel" id="feedbackPagePanel">
        <ul data-role="listview">
            <li data-icon="home"><a href="#homePage">Home</a></li>
            <li data-icon="envelope"><a href="#feedbackPage">Feedback</a></li>
            <li data-icon="cog"><a href="#settingsPage">Settings</a></li>
            <li data-icon="info"><a href="#aboutPage">About</a></li>
        </ul>
    </div>
    <!-- /panel -->
</div>

リストビュー(リンクではなく静的コンテンツ)が含まれていても、他のページでも同様に発生します。

ページは次のようになります。

良いふるまい

テキストをクリックすると、次のようになります。タイトルが右下に移動したことに注意してください

良くない行為

もう一度クリックすると、サイズが元の位置に戻ります。どうすればこれを防ぐことができますか?

4

1 に答える 1