Question

我想知道这是否可行。我已经设置了几行jQuery来获取页面上每个特定div的高度和负上边距这样我就可以将我的div放在屏幕上（标准方法（http://goo.gl/R6HfF））

$(window).load(function() {
    $('.each-web-project-info > div').each(function() {
        eachWebProjectInfoHeight = $(this).height();
        $(this).css('height',eachWebProjectInfoHeight+'px');
        $(this).parent().css('margin-top',-eachWebProjectInfoHeight -35+'px');
    });
});

我构建的框架是响应式的，因此div的宽度以百分比（50％）设置，左边距离为-25％。因此，当屏幕缩放时，div的位置不会在垂直和水平方向上居中。

所以，在这样的背景下，我要做的就是改变我的代码，以便获取每个div的高度并将其应用于margin-top作为调整大小时的负数。

任何帮助将不胜感激， -R

Answer 1

您只需要将divs margin更新绑定到窗口重新调整大小事件。像这样：

$(function () {

    updateDivsMargins();
    $(window).resize(updateDivsMargins);

    function updateDivsMargins() {
        $('div.centered').each(function () {
            $(this).css({
                'margin-top': (-$(this).height() / 2),
                'margin-left': (-$(this).width() / 2)
            });
        });
    }

});

工作小提琴：http://jsfiddle.net/DpBky/5/

在调整大小时使用jQuery动态更新高度和边距

1 个答案: