javascript - jQuery - 设置计算的 div 宽度

Question

我试图在我的页面上将帖子设置为卡片到一个 id="content"的 div(就像在 G+ 上一样)。

#content {
    margin-top: 120px;
    margin-bottom: 70px;
    margin-left: auto ;
    margin-right: auto ;
    height: auto;
}
.card {
    height: 250px;
    width: 500px;
    margin: 10px;
    float: left;

}

并且我想计算我可以将多少 .card 放入屏幕。所以我尝试了这个:

$(document).ready(function () {
    "use strict"; 
    var cardAmount = (Math.floor($(window).width/520))*520;
    $("#content").css("width", cardAmount);

});

但问题是(我认为).css 的第二个参数必须是字符串，但事实并非如此。

Answer 1

问题很可能是您需要向该数字添加一个单位，以便 CSS 引擎知道如何处理它。

此外，您的代码还有另一个问题 - 您没有在此处调用 width 函数:$(window).width。请记住，宽度是来自 jQuery API 的函数，而不是您可以像这样简单获取的 DOM API 参数。所以整个修复非常简单:

var cardAmount = Math.floor($(window).width() / 520);
$("#content").css("width", cardAmount + "px");

在这里 - 在 this fiddle 中查看它是如何工作的