Kollisionserkennung zwischen Bildern, die mit CSS-Animationen gedreht wurden

Ich benutze CSS-Animationen und jQuery, um Autos an einer Kreuzung (Top-View-Point) zu bewegen, um ein Führerschein-Quiz zu simulieren. Der Benutzer muss die Kreuzungsreihenfolge auswählen, indem er auf die Autos klickt.

Beispielbild:

Jedes Auto hat Eigenschaften und eine Animation wie diese zum Beispiel: blaues Auto, das RECHTS (anders als Bild) dreht:

Was ich nicht herausfinden will, ist, wie ich feststellen kann, ob zwei Autos kollidieren, da sie gedreht werden (drehen).

Wiedergabetastenfunktion:

Crash-Funktion (nur mit roten und grünen Autos Kollision arbeiten, weil sie nicht rotieren):

Gibt es eine einfache Möglichkeit, jede Art von Kollision zwischen jedem Bild mit der Klasse ".auto" zu erkennen?

Ich habe auch darüber nachgedacht, jeden Punkt des Rechtecks ​​zu berechnen und zu prüfen, ob einer von ihnen in einem anderen Rechteck (Auto) ist. Allerdings kann ich nur den oberen linken Punkt und nicht die anderen erreichen.

Irgendwelche Lösungen?

Vielen Dank im Voraus!