0

のような計算のように、画像を画面の中央に配置しようとしています

       var wh = jQuery(window).innerHeight();
        var ww = jQuery(window).innerWidth();
        var fh = jQuery('.drop').innerHeight();
        var fw = jQuery('.drop').innerWidth();

どこで間違いを犯したのかわかりません。私が試したようにウィンドウのサイズを変更するには

jQuery(window).resize(function() {
                var wh = jQuery(window).innerHeight();
                var ww = jQuery(window).innerWidth();
                var fh = jQuery('.drop').innerHeight();
                var fw = jQuery('.drop').innerWidth();
            });

しかし、ウィンドウのサイズを変更しても、上記のスクリプトは役に立たず、画像も中央に配置されません。

ウィンドウのサイズを変更しても、画像を中央に表示する方法はありますか。

ここにフィドルがあります

4

3 に答える 3

2

あなたはそれを試してみるべきです、

$(window).resize(function () {
    $('.drop2').css({
        position: 'absolute',
        left: ($(window).width() - $('.drop2').outerWidth()) / 2,
        top: ($(window).height() - $('.drop2').outerHeight()) / 2,
    });
});

デモ

于 2013-10-23T10:14:10.100 に答える
0

私は自分のプロジェクトでこのようにしました。

.side {
height: 357px;
background-color: red;
overflow: hidden;
position: relative;
}
.middle {
position: absolute;
left: 50%;
margin-left: -250px;
background:url('a.jpg') no-repeat;
width:500px;
height:357px;
}


<div class="side">
<div class="middle"></div>

于 2013-10-23T10:15:17.483 に答える