Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS CSS3 random number Reply To: CSS3 random number

#148219
Tim Pietrusky
Participant

Yeah I know, but you can create “kind of random” animations with this function:

$n: 16; 
$m: 8;

@keyframes random-animation {
  @for $i from 0 through $n {
    #{$i * 100% / $n} {
      @include transform(
        scale(random($n / $m) + 1.5)
        rotate(random(360) + deg)
        translate(random($n * 3 / $m) + em)
      );
    }
  }
}

The basic logic behind this is a combination of CodePen’s from Fabrice Weinberg / Ana Tudor. I added the random() function to create random keyframes.