46 liens privés
L'article décrit le processus de recréation d'une animation P5.js de Rach Smith en utilisant CSS, en particulier la propriété offset-path
. Initialement, l'auteur a tenté de suivre manuellement les positions et directions de chaque boîte dans l'animation, ce qui s'est avéré complexe. Cependant, il a découvert que l'utilisation de offset-path
avec la fonction inset()
permettait de créer un chemin carré le long duquel les boîtes pouvaient se déplacer en animant les valeurs de offset-distance
. Cette méthode a simplifié le processus et permis de distribuer uniformément les boîtes grâce à des valeurs de animation-delay
calculées proportionnellement. L'article explore également l'utilisation de offset-path
avec d'autres formes comme polygon()
pour créer des animations intéressantes et variées.