0

ポップアップ div がありposition:fixedます。最初は、コンテンツが読み込まれないまで、読み込み中の画像を表示したいと考えています。

私が使った

 this.css("top", ($(window).height() - this.height()) / 2 + $(window).scrollTop()  + "px");

this.css("left", ($(window).width() - this.width()) / 2 + $(window).scrollLeft()  + "px");

画面に従ってdivを中央に配置します。それは正常に動作します。

コンテンツが単純なテキストの段落から複雑なフォームに及ぶため、コンテンツがロードされた後に問題が発生し、それらは右および下方向に拡張されます。私のdivはその小さな「読み込み」画像に従って中央に配置されていたので、新しいコンテンツでは右と下に向かっています。

div を 4 方向すべてに拡張する方法はありますか。

4

1 に答える 1

0

First of all, let's fix up your div centering. For a fixed div, consider the following:

<!DOCTYPE html>
<html>
    <head>
        <style>
            div.center
            {
                position: relative;
                width: 400px;
                height: 400px;
                margin: 0px auto;
                background-color: red;
            }

            div.fix
            {
                position: fixed;
                width: 100%;
                margin: 100px auto;
            }
        </style>
    </head>
    <body>
        <div class="fix"><div class="center"></div></div>
    </body>
</html>

This will center your div dynamically, no matter HOW it's sized, or how it changes (both height and width). It's also very much not-hacky (which I approve of). Try applying this sort of CSS to your issue and it should resize gorgeously.

于 2012-07-03T10:39:20.447 に答える