ランダムな値を生成したいけど最小値は設定したい
というときのためのSCSS
// 指定した最小値($min)と最大値($max)の間のランダムな数を返す
// 単位は$unitに指定（px,%,vw,vh,vmax,vmin）
// minMaxRandom(80, 100, 1%)
@function minMaxRandom($min: 1, $max: 100, $unit: 1%) {
$num: random($max);
@while ($num/($num * 0 + 1) < $min) {
$num: random($max);
}
@return $num * $unit;
}
使い方
（例）div100個に幅と高さが100pxから200pxのランダムな数値を指定する
@for $i from 1 through 100 {
div.nth-child(#{$i}) {
$rondomNum: minMaxRandom(100, 200, 1%);
width: $rondomNum;
height: $rondomNum;
}
}
デフォで最小値も設定できたらいいのに。。
と思った次第でした。
おしまい。