ipad - 向きの変更時に位置を変更するjqueryモバイルポップアップ - iPad

Question

アプリが開いたときに開くjQuery Mobileポップアップウィンドウがあります。初期ロード時に、画面の下部中央にある div 内にポップアップを配置しました。

iPad の向きに合わせて、このポップアップを画面の下部近くに配置したいと思います。しかし、画面を縦向きにしてから横向きに戻すと、ポップアップが画面の中央に移動します。

jQuery を使用して位置をリセットする方法をいくつか試し、メディア クエリ css を追加しましたが、これまでのところ何も機能していないようです。私のコードは以下のとおりです。助けてくれてありがとう。

html:

<div id="popupContainer">
    <div data-role="popup" id="disclaimer" data-position-to="#popupContainer"  data-transition="fade" data-history="false">
        <p><span id="infoText">some texthere.</span></p>
    </div>
</div>

CSS:

#popupContainer{
width: 450px;
display: block;
position: relative;
margin-left:auto; margin-right:auto;
top:80%;
z-index: 10;
}
#disclaimer{
max-width: 450px;   
}

js:

$( window ).on( "orientationchange", function( e ) {
if (window.orientation === 0 || window.orientation === 180)
{
    $("#disclaimer").popup( "reposition", { positionTo: "#popupContainer"});
        $("#popupContainer").css("top", "60%");
}
if (window.orientation === 90 || window.orientation === -90)
{
    $("#disclaimer").popup(  "reposition", {positionTo: "#popupContainer"});
    $("#popupContainer").css("top", "80%");

}
});