ResizeObserver

Définition

API qui observe les changements de taille d'un élément DOM. Appelle le callback quand les dimensions changent, sans dépendre du resize de la fenêtre.

Analogie

Un mètre automatique colle sur un meuble qui t'alerte des que les dimensions changent.

Exemple de code

const observer = new ResizeObserver((entries) => {
  for (const entry of entries) {
    const { width, height } = entry.contentRect;
    console.log(`${width}x${height}`);
  }
});
observer.observe(document.querySelector('.chart'));

Cas d'usage

Graphiques responsifs, conteneurs flexibles, composants qui s'adaptent a leur taille.

Termes liés