Javascript Festkörper für bestimmte Blöcke erstellen?

1 Antwort

Du meinst, damit deine Figur auf diese Plattformen springen kann?

Dafür musst du überprüfen, ob die Hitbox der Plattform mit der Hitbox der Figur kollidiert.

function checkCollision(el1, el2) {
  const rect1 = el1.getBoundingClientRect();
  const rect2 = el2.getBoundingClientRect();

  return rect1.left < rect2.right && 
         rect1.right > rect2.left && 
         rect1.top < rect2.bottom && 
         rect1.bottom > rect2.top;
}

Diese Funktion gibt dir einen Boolean Wert zurück. True bei Kollision, False wenn nicht. Den Check musst du für jede Plattform ausführen, einfach in einem for-loop.

Falls deine Figur nun mit einer Plattform kollidiert, setzt du die y-Koordinate deiner Figur so, dass sie auf der Plattform stehen bleibt.
Das solltest du aber nur machen, falls deine Figur nach unten fällt, somit also von oben darauf landet.
Falls deine Figur sich gerade nach oben bewegt kannst du den Check entweder weglassen (-> Wie DoodleJump, man kann von unten durch die Plattformen hindurch hüpfen, und dann auf ihnen landen) oder die Figur an die Unterseite der Plattform zurücksetzen, als wäre sie mit dem Kopf daran abgeprallt.

Woher ich das weiß:Hobby – Programmieren ist mein Hobby & Beruf

Danichaoszock4 
Beitragsersteller
 04.07.2023, 20:56

wo soll ich dann die namen für miene blöcke hinschreiben noch dazu ich will viele blöcke das als festkörper außer einem block der springt auf die anderen blöcke und die blöcke wo er druafspringt soll stehen bleibenn und die sollen so als ob die geklebt wären stehen

0
MrAmazing2  04.07.2023, 21:04
@Danichaoszock4

Naja, du rufst die Funktion einfach auf mit einer Liste deiner Blöcke

const blocks = [...document.getElementsByClassName("block")];

for (const block of blocks) {
  if (checkCollision(player, block)) {
    // Dein Spieler berührt einen Block
  }
}

Dafür musst du allen Blöcke diese eine "block" Klasse geben. Ein Element kann ja mehrere Klassen haben, also sollte kein Problem sein.

0