Chemin de mouvement offset-path
Des propriétés CSS qui déplacent un élément le long d'une courbe arbitraire, au lieu de le faire aller en ligne droite d'un point à un autre.
Le chemin se donne avec offset-path, en général dans la syntaxe ordinaire des chemins SVG, et la position sur ce chemin avec offset-distance, exprimée en pourcentage. Animez cette dernière de zéro à cent : l'élément glisse le long de la courbe, et avec offset-rotate: auto il pivote pour pointer dans le sens du déplacement — la différence entre déplacer un avion et le piloter. Le chemin peut aussi être un ray() avec un angle et une longueur, une forme de base, ou une référence à un chemin dans un document SVG. Auparavant, il fallait soit une bibliothèque JavaScript recalculant la position à chaque image, soit animateMotion de SVG, qui ne fonctionnait qu'à l'intérieur de SVG. Largement pris en charge depuis 2022.