不同屏幕宽度的随机高度 [英] random heights on different screen widths

问题描述

在达到某些窗口宽度时，投影容器divs的高度有一个小问题。它发生的宽度是从1025到1041和768到784.你可以看到我的意思，如果你调整浏览器窗口到上面的高度在实际页面上：mrliger.com/index2.php

there is a slight problem with the portfolio container divs height when it reaches certain window widths. The widths it occurs on are from 1025 to 1041 and to 768 to 784. You can see what I mean if you resize your browser window to the above heights on the live page: mrliger.com/index2.php

这个div有一些jquery附加到它以调整其高度在这种形式，我怀疑这可能是导致这与媒体查询导致它：

this div has some jquery attached to it to resize its height in this form, I suspect this is what might be causing this as opposed to a media query causing it:

$(window).resize(function() {
     if ($(window).width() >= 1025) {
         var cw = $(".portfoliocontainer").width() / 4;
         $('.portfoliopod:not(.podexpanded)').height(cw);
     }
     if ($(window).width() <= 1024) {
         var cw = $(".portfoliocontainer").width() / 3;
         $('.portfoliopod:not(.podexpanded)').height(cw);
     }
     if ($(window).width() <= 767) {
         var cw = $(".portfoliocontainer").width() / 2;
         $('.portfoliopod:not(.podexpanded)').height(cw);
     }
     if ($(window).width() <= 400) {
         var cw = $(".portfoliocontainer").width();
         $('.portfoliopod:not(.podexpanded)').height(cw);
     }
 });

推荐答案

尝试将宽度设置为与高度相同

Try setting the width to be the same as the height

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

function portResize() {
    var cw;
    if ($(window).width() >= 1025) {
        cw = $(".portfoliocontainer").width() / 4;
    }
    if ($(window).width() <= 1024) {
        cw = $(".portfoliocontainer").width() / 3;
    }
    if ($(window).width() <= 767) {
        cw = $(".portfoliocontainer").width() / 2;
    }
    if ($(window).width() <= 400) {
        cw = $(".portfoliocontainer").width();
    }
    $('.portfoliopod:not(.podexpanded)').width(cw);
    $('.portfoliopod:not(.podexpanded)').height(cw);
}

这篇关于不同屏幕宽度的随机高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！