等高柱不添加填充

Question

我使用下面的代码来等于列高，但它不计算填充，因此文本会从div中出来。

<script>
        $(document).ready(function(){
            //set the starting bigestHeight variable
            var biggestHeight = 0;
            //check each of them
            $('.equal').each(function(){
                //if the height of the current element is
                //bigger then the current biggestHeight value
                if($(this).height() > biggestHeight){
                    //update the biggestHeight with the
                    //height of the current elements
                    biggestHeight = $(this).height();
                }
            });
            //when checking for biggestHeight is done set that
            //height to all the elements
            $('.equal').height(biggestHeight);

        });
    </script>

Answer 1

尝试使用.outerHeight()

http://api.jquery.com/outerHeight/

• .height() =身高
• .outerHeight() =高度+填充+边框
• .outerHeight(true) =高度+填充+边框+边距

如果你的元素中有图像，你应该等待使用$(window).load()加载图像

    $(window).load(function(){ // wait for all content and images are loaded
        var biggestHeight = 0;
        $('.equal').each(function(){
            if($(this).height() > biggestHeight){
                biggestHeight = $(this).height();
            }
        });
        $('.equal').height(biggestHeight);
    });