javascript - 在 div 中调整动态内容的大小并使其居中

Question

我正在尝试在 div onLoad 中调整动态内容的大小并使其居中，并在调整窗口大小以适应我的流动布局。

发布链接 < http://jsfiddle.net/h52tqaz2/">fJSFiddle >由于易于理解。

为什么它不将所有 DIV onLoad 居中(但在调整大小时居中)？如何根据窗口的高度以及窗口的宽度通过保持其纵横比来制作此比例？

注意:动态内容的大小不一样。

Answer 1

使用 ready 而不是 onload :

$(document).ready(center_images);
$(window).resize(center_images);

function center_images() {
    var parent_width = $('.container').width();
    $('.content').each(function() {
        var content_width = $(this).width();
        var margin = (parent_width-content_width)/2;
        $(this).css('left', margin);
    });
}

Check JSFiddle Demo