1

ログイン フォーム (またはその他の機能) を含む新しいレイヤーを作成し、それを画面の中央に表示したい (画面の解像度とコンテンツによって異なります)。

これはコードです：

  function new_layer() {
    $('#frameContainer, #showbox').show();
    $('#showbox').load('includes/login.php');
    $(document).ready(function(){
        var hei = eval($(window).height()/2 - $('#showbox > *').outerHeight()/2);
        var wid = eval($(window).width()/2 - $('#showbox > *').outerWidth()/2);
        $('#showbox').css({
          top: hei + "px",
          left: wid + "px"
        }).show();
    });

    // ..................

最初は機能せず、ファイルの内容login.phpが中央に配置されています:( 、しかし、外側をクリックして非表示にし、もう一度クリックすると機能します。ページを更新すると、問題が再び発生します。

何が問題で、どうすれば修正できますか?

4

2 に答える 2

0 
$(function(){
var loginDialog = $('#loginDialog');

    $.blockUI();
    var dlgWidth = loginDialog.outerWidth();
    var viewPortWidth = $(window).width();
    var pos = (viewPortWidth - dlgWidth ) / 2;
    loginDialog.css({

        'position', 'absolute',
        'left' :  pos + 'px',
        'z-index' : '1999' //greater than setting for blockUI
    });

});

blockUIの詳細はこちら

于 2012-09-04T14:27:56.033 に答える
0

そのために JS 計算は必要ありません。

#loginDialog {
    height: 300px;
    width: 400px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -150px; /* half of the height */
    margin-left: -200px; /* half of the width */
}
于 2012-09-04T14:31:31.527 に答える