Question

当组合容器div达到特定窗口宽度时，它有一个小问题。它出现的宽度是1025到1041和768到784.如果你将浏览器窗口调整到实际页面的上述高度，你可以看到我的意思：mrliger.com/index2.php

这个div附加了一些jquery来调整它在这种形式下的高度，我怀疑这可能是导致它的原因而不是导致它的媒体查询：

$(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);
     }
 });

Answer 1

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

$(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);
}

不同屏幕宽度的随机高度

1 个答案: