Jquery 无窗口布局html网格（响应）

编辑只是为了弄清楚我想要什么：我当前的算法有点基本，行太多。我希望在不添加寡妇的情况下使用尽可能少的行

我试图在没有一到两个寡妇在最底层的情况下设计我的产品。我制作了一个小的原型，但它并不总是像预期的那样工作（它应该总是尝试使用最大宽度，同时减少底部只有1或2个正方形的可能性）

函数格式（val）{
var decimal=val.toString（）.substr（val.toString（）.indexOf（“.”）+1，1）
如果（（val=6 | | isInt（val））&&&&$（'.product'）.outerWidth（true）*val<$（'body'）.width（））{
返回true；
}否则{
返回false；
}
}
函数重新计算（）{
对于（变量i=1；i<6；i++）{
if（格式（$（'.product'）.length/i））{
$（'.product'）。宽度（$（'.product'）。外径（真）*$（'.product'）。长度/i）；
打破
}
}
}

应该有一种方法来减少寡妇，并以尽可能最佳的方式安排离婚。有什么建议吗

预期结果（尝试扩展JSFIDLE窗口的宽度）：

当窗户不是很大的时候，她有一个寡妇。3行应该是2行

11,14,17,20应为3行，而不是4行

13也很难，但不是很确定

---

更新：如果有人知道更好的方法，请回答：

这是我能做的最好的：

我刚刚添加了

Math.ceil（）

，并删除了一些不必要的检查

这是可行的，但可能有更干净的方法来达到同样的效果

function format(val) {
    var decimal = val.toString().substr(val.toString().indexOf(".") + 1, 1)
    if ((val <= 4 || (decimal >= 6 || isInt(val))) && $('.product').outerWidth(true) * val < $('body').width() ) {
        return true;
    } else {
        return false;
    }
}
function recalculate() {
    for (var i = 1; i < 6; i++) {
        if (format($('.product').length/i)) {
            $('.products').width($('.product').outerWidth(true) * $('.product').length/i);
            break;
        }
    }
}