Nasłuchiwanie na okno przeglądarki podczas zmiany jej rozmiary

Question

Mam taki problem że nie moge znaleść metody która będzie nasłuchiwać cały czas na okno przeglądarki i jak ktoś zmieni rozmiar to żeby wykonała sie dana funkcja

 

const circle = document.querySelector(".circle");
const win = window.document;
console.log(win);

const change = () => {
  const widthCircle = circle.clientWidth;
  circle.style.height = widthCircle + "px";
};

change();

window.addEventListener("resize", change());

Na tą chwile tylko takie coś wykombinowałem ale nie działa XD

Szukam rozwiązania w JS a nie w JQ

Z góry dziękuje za pomoc

Comments

używasz jakiegoś frameworka typu react, vue?

---

Nie, tylko JS

---

@kuba1245677, przekazujesz do event listenera wartość zwróconą z funkcji change (a jest nią teraz undefined), a nie jej referencję. Dlatego funkcja ta nie jest uruchamiana przy wystąpieniu eventu resize.

Powinieneś zapisać to w ten sposób:

window.addEventListener("resize", change);

 

Answer 1

window.addEventListener('resize', () => {console.log('resized')})

 

Answer 2

To wydaje się być jedynym sensownym rozwiązaniem

Comments

Przecież OP użył listenera nasłuchującego na resize event.

---

Tak, ale źle... Jak sam wspomniałeś, niepotrzebnie dał nawiasy. W linku, który dałem w przykładzie tych nawiasów nie ma. Dodatkowo jest tam jeszcze wyjaśniony widnow.onresize.

---

Ok, ale z Twojej wypowiedzi bezpośrednio nie wynika gdzie jest błąd w kodzie OP-a ani jak go poprawić. Ja zrozumiałem, że ogólnie proponujesz użycie eventu, który OP już stosuje, stąd mój poprzedni komentarz. :)

---

Dodatkowo jest tam jeszcze wyjaśniony widnow.onresize event.

To bardzo ciekawe, zważając na fakt, że taki event nie istnieje.