jquery - iOS デバイス用の jQuery UI ダイアログ ボックスの適応

Question

jQuery UI を使用して、ユーザーが mailto リンクをクリックしたときに表示されるダイアログを作成しています。つまり、ダイアログは、続行する前にユーザーが条件に同意することを確認します。残念ながら、iPhone ではダイアログが小さすぎて、ユーザーが以前にズームインしたことがある場合、画面の中央に表示されません。

コードは次のとおりです。

...
    .dialog({
        autoOpen: false,
        title: 'Disclaimer',
        resizable: false,
        width: 500,
        modal: true,
        position: 'top+10%',
        buttons:            
            {
    "Accept": function() {
      $( this ).dialog( "close" );
      window.location.href="mailto:"info@example.com;"
      },
    "Cancel": function() {
      $( this ).dialog( "close" ); }
 }
 });

$('.email-address').click(function(event) {
event.preventDefault();
    $dialog.dialog('open');
    $('.ui-dialog :button').blur();
});
});

この問題に対処する最善の方法を見つけようとしています。理想的には、ダイアログが画面の大部分を占め、ユーザーがズームインしても常に中央に表示されるようにします (つまり、表示時にダイアログが途切れないようにしたいです)。または、ダイアログを iPhone のネイティブ ダイアログ ボックスとして動作させたいと考えています。後者を行う場合、スマートフォンで表示した場合にのみ実行される別のスクリプトを作成する必要がありますか?

これらの目標のいずれかを達成するための最善の方法についての考えは大歓迎です。