Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/neo4j/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 随机宽度div填充容器宽度_Javascript_Jquery_Html_Css - Fatal编程技术网
Fatal编程技术网
  • javascript/
  • Javascript 随机宽度div填充容器宽度

Javascript 随机宽度div填充容器宽度

javascript jquery html css

Javascript 随机宽度div填充容器宽度,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我必须在容器的宽度中填充div。但是每个div的width是在jQuery中的3个可能宽度之间随机选择的 有一个JsFiddle，在那之后更容易理解我的意思。 $（文档）.ready（函数（）{ 风险值类别=[“col-sm-4”、“col-sm-3”、“col-sm-2”]； $（“#container.item”）。每个（函数（）{ $（this.addClass（classes[~~（Math.random（）*classes.length）]）； }); }); #容器{} .项目{

我必须在容器的
宽度
中填充
div
。但是每个
div
的
width
是在jQuery中的3个可能宽度之间随机选择的

有一个JsFiddle，在那之后更容易理解我的意思。




$（文档）.ready（函数（）{
风险值类别=[“col-sm-4”、“col-sm-3”、“col-sm-2”]；
$（“#container.item”）。每个（函数（）{
$（this.addClass（classes[~~（Math.random（）*classes.length）]）；
});
});

#容器{}
.项目{
背景色：#000；
高度：250px；
最小宽度：16.666%；
浮动：左；
边缘底部：1px；
颜色：#FFF；
边框：1px实心#FFF；
}
.第2项col-sm-2{
宽度：16.666%；
}
.第3项col-sm-3{
宽度：25%；
}
.第4项col-sm-4{
宽度：33.33333%；
}



A.
B
C
D
E
F
G
H
我
J
K

您可以创建一组有效的组合来填充一行，然后根据您获得的项目数量随机选择一组，直到您的配额被填充

要填充一行的组合：


items | 1/6 | 1/4 | 1/3
  1      -     -     -
  2      -     -     -
  3                  3
  4            4
  4      1     2     1
  5      4           1
  6      6



请始终在问题中包含所有相关代码。用户不必离开现场来回答，更不用说理解你的问题了。如果你只有三种宽度，如何才能完美地装满容器？@Rorymcrossan当然很抱歉。@FrancoScarpa，这就是问题啊哈。说真的，我不知道，这就是我问的原因。对于完全随机宽度（没有我的3个宽度），有什么解决方案可以做到这一点。你将无法处理1或2个项目的情况，其余的你可以管理，但需要一些逻辑来帮助你的随机函数，所以它不是随机的，我想当你达到100%的宽度时，你会创建一个新行？