0

Web ページの中央に div を配置するコードを取得しました。コードはクロムでうまく機能しますが、何らかの理由でIE(9または10だと思います)で初めて機能し、その後機能しません。

問題を示すために、いくつかの写真を示します: (理解できない記号は無視してください。それが私の言語です)

クロム:

ここに画像の説明を入力

IE で初めてオブジェクトをクリックして開きます。

ここに画像の説明を入力

IE で 2 回目以上、オブジェクトをクリックして開くと、次のようになります。

ここに画像の説明を入力

これは、divを中央に配置するために使用しているコードです:

    jQuery.fn.center = function ()
{
    this.css("position","fixed");
    this.css("top", ($(window).height() / 2) - (this.outerHeight() / 2));
    this.css("left", ($(window).width() / 2) - (this.outerWidth() / 2));
    return this;
}

関数を使用するコードcenter():

$('#products,#search-result').on("click",'.product-item-info',function() {
    var pid = $(this).find('input').val();
    $.get('product_info.php',{pid:pid},function(data){
        $('#product-lb').html(data).append('<span class="x"><span>X</span></span>');
        $('.x').click(function() {
            $('#dimmer').click();
        });

        $('#dimmer').css({width:$('html').width(),height:$('html').height()});
        $('#product-lb').center();
        $('#product-lb').show(800);
        $('#dimmer').show();
        $(window).resize(function() {
            $('#product-lb').center();
        });
    });
});

説明: #products図でわかるように、青と緑で色付けされたすべての div を含む div は .product-item-info、各製品 DIV にある四角形のクラスです。 #dimmer黒い背景 #product-lbは、ページの中央に配置して表示する必要がある div です。

これで十分な情報だと思います!これ以上必要な場合は、お気軽にお尋ねください。

前もって感謝します!

4

1 に答える 1

-2

すでに jQuery を使用している場合は、ダイアログにjQueryUIを使用してみませんか?

とにかく、通常の方法で行きたい場合は、素晴らしい position:absolute メソッドを使用してみませんか?

これは div にも適用され、IE7+ と互換性があります。さらに、これは CSS のみのものです。

于 2013-09-27T08:20:53.557 に答える