我有一个容器 div。在该容器 div 内部是一些较小的 div，我想在父 div 的宽度之间留出间隔，同时在每个 div 之间添加一个间隙。内部 div 的数量会发生变化。
我正在使用这个公式(containerWidth-(numberOfBars*gap))/numberOfBars来计算每个条的空间，然后尝试 jquery 动态修改 css。
我无法改变宽度或让它们间隔开。
附上小提琴。
谢谢！
问问题
99 次
1 回答
3
您应该熟悉outerWidth(); 我认为它非常适合这种情况。当true被传递时，它将占用容器的外部宽度，包括边距。因此，当您有一个宽度的项目0并采用外部宽度时，它将只是您不希望包含在宽度中的填充/边距/边框。
接下来，我玩了一下你的逻辑。我取了每个条的总宽度而不是内部宽度，然后使用外部宽度从中获取内部宽度。（即，Container width / n -> Outer Width; Subtract padding -> Inner Width。）
在分享更新的小提琴之前，我要注意的最后一件事是：请，请，请，在未来，请先测试你的小提琴。您创建了bar和container变量，但都没有定义。你也没有使用过$(document).ready(...)或类似的东西。
首先，我将您设置width为0（以获得适当的外部宽度）。然后我计算了宽度，如下所示：
var barOuterWidth = Math.floor(containerWidth / n);
var barInnerWidth = barOuterWidth - $(".bar").outerWidth(true);
最后，我用来'width': barInnerWidth,设置宽度。
结果在这个 jsFiddle 中。注意右边有一个边距；我相信你可以找到缓解这种情况的方法。（i == n - 1或诸如此类的东西。）
于 2012-09-12T19:41:17.317 回答