0

jQuery Mobile を使用すると、以下を使用してページに固定ツールバーを作成できます。

<div data-role="header" data-position="fixed">Content</div>

私がやりたいのは、デバイスの向きが変わったときに固定ヘッダーを非表示にすることです。次を使用してこれを検出できます。

$(window).on('orientationchange ', function() {
    if (event.orientation === 'portrait') {

    }
    else if (event.orientation === 'landscape') {
    }
});

ページから固定ツールバーを非表示にするにはどうすればよいですか? ツールバーの設定display: noneは機能しますが、ヘッダーが以前あった場所に空のスペースが残ります。

4

1 に答える 1

2

作業例: http://jsfiddle.net/d2mMv/

Javascript:

$(document).on('pagebeforeshow', '#index', function(){       
    $('#test-header').hide();
    $('#test-content').addClass('test-content');
});

CSS:

.test-content {
    margin-top: -40px !important;
}

残念ながら、ヘッダーを非表示にしているため、ヘッダーがまだ存在しているため、 create、pagecreateまたはupdatelayoutをトリガーできるため、 css を使用して手動で行う必要があります。

于 2013-04-24T10:07:08.250 に答える