Gibt es ein Javascript Event, welches feststellt das ein HTML-Element die Position verändert hat?

Oder eine andere Möglichkeit, die konstant prüft ob zwei zuvor definierte Variablen, mit den Werten der Position gleich ist?

MfG,

Bohne47

Answer 1

[medmonk]

Du kannst dafür u.a. getBoundingClientRect() einsetzen, in dem du dir eine eigene Funktion schreibst, mit der über setInterval() oder setTimeout() immer wieder eine bestimmte Abfrage erfolgt. Was du dir dann als "return" zurückgeben lässt, kann dann beliebig innerhalb einer if oder if-else Abfrage definieniert werden.

const checkPosition = () => {
  let element  = document.querySelector('#id'),
      position = element.getBoundingClientRect(),
      top      = 0,
      right    = 0,
      bottom   = 0,
      left     = 0;
  if (position.top == top && position.right == right && position.bottom == bottom && position.left == left) {
    console.log('position correct');
  } else {
    console.log('position incorrect');
  }
}

Woher ich das weiß: Berufserfahrung – UI/UX Designer, Full-Stack Developer

Answer 2

[Destranix]

Die Elemente bewegen sich nicht einfach so. Du hörst auf die Events, die die Elemente bewegen können.

Ansonsten kannst du mit "setInterval" eine Funktion immer wieder aufrufen oder aber mit "requestAnimationFrame" das ganze auch mit der Anzeigefrewuenz synchronisieren.

Ein Event nur für die Bewegung konnte ich jetzt nicht finden, auch wenn es an sich sinnvoll klänge.