Einem rotierten Element eine Skalierung verpassen ohne die Rotation kaputt zu machen

[Rolf B]

Hallo T-Rex,

Jürgens Hinweis auf custom properties dürfte hilfreich sein. Beachte nur, dass Du dann die Einheit mit in das custom property packen musst.

<div style="animation: pulse 1s; --drehung: 90deg"></div>

@keyframes pulse {
   0% { transform: scale(1) rotate(var(--drehung)); }
  50% { transform: scale(1.5) rotate(var(--drehung)); }
 100% { transform: scale(1) rotate(var(--drehung)); }
}

sollte möglich sein, ich kann es nur zur Zeit nicht ausprobieren.

Falls Du den Wert eines custom property animieren willst, geht das zur Zeit nur in Chrome, dafür brauchst Du Variablendeklarationen die Teil des Houdini-Projekts sind. Siehe dazu meinen letzten Blogbeitrag.

Rolf