Zdarzenie rozmiaru okna JavaScript

Zdarzenie rozmiaru okna JavaScript

„„Zmień rozmiar„Wydarzenie w JavaScript to wbudowane zdarzenie wywołane, gdy użytkownik zmienia rozmiar okna przeglądarki. To zdarzenie można użyć do dostosowania układu lub zachowania strony internetowej w odpowiedzi na nowy rozmiar okna. Zdarzenie jest wyzwalane/wystrzelone na obiekt okna, który oznacza okno przeglądarki.

Ten post ilustruje zdarzenie rozmiaru okna w JavaScript.

Jakie jest zdarzenie okna „rozmiar” w JavaScript?

W JavaScript „The„Zmień rozmiar„Zdarzenie jest wystrzelone, gdy zmienia się rozmiar okna przeglądarki. Możesz dołączyć funkcję do zdarzenia rozmiaru za pomocą „addEventListener ()”Metoda na obiekcie okien. To wydarzenie uruchomi się za każdym razem, gdy okno przeglądarki jest rozmiar.

Składnia

Poniższa składnia jest używana do zdarzenia rozmiaru do zmiany rozmiaru okna za pomocą metody „addEventListener ()”:

okno.addEventListener („rozmiar”, FuncName)


Zaleca się usunięcie słuchacza zdarzeń, aby uniknąć wycieków pamięci. Do usunięcia słuchacza zdarzeń użyj „removeventListener ()" metoda:

okno.removeVentListener („rozmiar”, FuncName);


Przykład

W dostarczonym przykładzie długość i szerokość okna będą wyświetlane na stronie podczas rozmiaru okna.

Najpierw utwórz obszar rozpiętości do wyświetlania długości i szerokości okna:

Szerokość okna:

Wysokość okna: id = "Height">


Następnie, w tagu, zdefiniuj funkcję „WindowResize ()„Gdzie otrzymuj odniesienie do elementów długości i szerokości, aby wydrukować wartości:

funkcja oknaSize ()
dokument.getElementById („wysokość”).innerText = dokument.dokumentElement.ClientHeight;
dokument.getElementById („szerokość”).innerText = dokument.dokumentElement.ClientWidth;


Zadzwoń do "Zmień rozmiar„Wydarzenie w„addEventListener ()„Metoda i dołącz zdefiniowaną funkcję do zdarzenia:

okno.addEventListener („rozmiar”, WindowResize);


Zadzwoń do "WindowResize ()" po raz pierwszy:

WindowResize ();


Wyjście wskazuje, że wartość jest ciągle zmieniana podczas zmiany rozmiaru okna:


To wszystko o wydarzeniu rozmiaru okna w JavaScript.

Wniosek

„„Zmień rozmiar„Wydarzenie w JavaScript jest wyzwalane, gdy rozmiar okna lub elementu zostanie zmieniony. Może wykryć zmiany w rozmiarze okna przeglądarki lub określonego elementu. Zdarzenie można dodać do okna lub elementu za pomocą „addEventListener ()”Metoda i określenie„Zmień rozmiar”Jako typ zdarzenia. W tym poście zilustrowaliśmy wydarzenie rozmiaru okna w JavaScript.