简体   繁体   English

在窗口上调整大小更改chrome中的div高度

[英]on window resize change div height in chrome

.content-block class content dynamic text, so height is different to each div block. .content-block类内容为动态文本,因此高度与每个div块都不同。 Using javascript max height of div find apply to other div's so on browser resize all div will same height. 使用div的javascript max height查找适用于其他div的高度,以便在浏览器中调整所有div的大小将具有相同的高度。 Below pseudo code working in most of the browser, but in chrome, browser resize less than 320x480 will not work. 在大多数浏览器中都可以使用的伪代码下方,但在chrome中,将浏览器调整为小于320x480的大小将不起作用。

<script type="text/javascript">
function getMaxHeight(){ 
    return maxHeight = Math.max.apply(null, $(".content-block").map(function (){
         return $(this).height();
     }).get());
}

$(window).resize(function(){
    $('.content-block').css('height', 'auto');
    $('.content-block').css('height', getMaxHeight);
});

$('.content-block').css('height', getMaxHeight);
</script>
<style>
.content-block{
    height: auto;
    display: block;
}

If you can use css flexbox for this purpose, using JavaScript might lead to scaling issues. 如果可以将CSS flexbox用于此目的,则使用JavaScript可能会导致扩展问题。 Here is CSS-Tricks Reference 这是CSS技巧参考

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM