Elementheightafterpageiscomplete

I have an absolute div, and a parent div. How I can define the height of the parent based on the absolute div, knowing I have images which take some time to load?

我有一个绝对的div和一个父div。如何根据绝对div定义父级的高度,知道我有需要一些时间加载的图像?

CSS:

#parent {
    overflow:hidden;
    width:100%;
}
.absolute {
    overflow:hidden;
    width:100%;
    height:100%;
}

HTML:

    

        [LOTS OF CONTENT WHICH MAKE A VARIABLE HEIGHT, INCLUDING IMAGES WHICH TAKE SOME TIMES TO LOAD HERE]
    
    

        [LOTS OF CONTENT WHICH MAKE A VARIABLE HEIGHT, INCLUDING IMAGES WHICH TAKE SOME TIMES TO LOAD HERE]
    

SAMPLE LINK 1
SAMPLE LINK 2

JS:

jQuery(document).ready(function($) {
    $('a').bind('click', function(e) {
        var target = $(this).attr('href');

        if($(target).html() !== undefined ) {
            $('#parent').css({
                'height': $('#parent').find(target ).height(),
            })
        }

        e.preventDefault();
    });


    // The problem: height is not correct until image is loaded/in cache
    $('a[href="#absolute1"]').trigger('click');
});

1 个解决方案

$(window).load(function(){
  // Your code here
});