[CSS揭秘]伪随机背景

大自然中的事物都不是以无限平铺的方式存在的,如果想让事物营造一种自然随机性,那么就需要使用一种伪随机的技巧。

当你注意到一个有辨识度的特征在以固定的规律循环重复时,那么它视图营造的自然随机性就会立刻崩塌。

如何产生一种真实的随机条纹呢,这就需要先了解什么叫做最大公倍数以及质数。

如果有多层图案,并且每一层图案都在按照自身的数学规律在重复时,那么最终重叠产生的图案就会以这些图案的数学规律的最小公倍数来进行重复。

为了让最小公倍数最大化,那么这些数字最好是“相对质数”或者都是质数。

这个技巧是一个叫Alex Walker提出的,命名为"蝉原则"。

运用场景:

1. 在图片库中,为每一幅图片进行细微的伪随机旋转效果,可以通过质数来选取指定的子元素使其旋转某个质数相应的角度。

2. 为某个元素定义动画时,可以定义多个时长为不同质数的动画。

posted @ 2016-12-19 23:01  小碎石  阅读(499)  评论(0编辑  收藏  举报