0

编辑：阅读有关亚像素渲染的更多信息，我了解到导致小数或部分像素值的 CSS 值不是“浏览器友好的”。因此，值应设置为小数位！

我正在通过对所有子元素（.project）的宽度求和来计算父元素（.container）的宽度。到目前为止，我尝试了这个，但它不起作用。有人可以帮帮我吗？

例如：当我有五个子元素，每个子元素的宽度为 363.667 像素时，我想获得 364 像素的宽度。

HTML 标记

<div class="container">
    <ul id="projects">
        <li class="project"></li>
        <li class="project"></li>
        <li class="project"></li>
        <li class="project"></li>
        <li class="project"></li>
        <li class="clear"></li>
    </ul>
</div>

jQuery

$(window).on( "resize", function () {
    var width = ( $(window).width() / 3 );
    $(".project").css({ width : width.toFixed() });

    var sum = 0;
    $("#projects .project").each( function(){ sum += $(this).width(); });
    $(".container").width( sum );
}).resize();
4

1 回答 1

0

你能替换：

$(window).width(), $(this).width(),

使用硬代码值并重做测试，看看这是否是您期望的值，

.width()无论 CSS box-sizing 属性的值如何，都将始终返回内容宽度。从 jQuery 1.8 开始，这可能需要检索 CSS 宽度加上 box-sizing 属性，然后当元素具有box-sizing: border-box. 为避免这种惩罚，请使用.css("width")而不是.width().

于 2014-08-21T07:26:43.840 回答