Quiero llamar a una función cada vez que se cambia el tamaño de la ventana de una página y cuando la página se representa por primera vez. Para hacer esto, actualmente estoy usando el siguiente código:
window.addEventListener('resize', function(event){ // Here will be my function });Esto llama a la función cada vez que se cambia el tamaño de la ventana, pero ¿se llamará a la función cuando la página se muestre por primera vez? Si no, ¿cómo se puede hacer esto?
EDITAR:.
He actualizado mi código para que se vea como este fragmento:
window.onload = (event) => { callName() window.addEventListener('resize', function(event){ callName() }); }; function callName(){ console.log('Hi Neo!') }esto funcionara?
function callName(){ // Your functionality here... console.log('Hi Neo!') } window.onload = () => { callName() window.addEventListener('resize', callName); }Escribe aquí: https://codepen.io/freedruk/pen/MWobaao
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>JavaScript Window Resize Event</title> </head> <body> <div id="result"></div> <script> // Defining event listener function function displayWindowSize(){ // Get width and height of the window excluding scrollbars var w = document.documentElement.clientWidth; var h = document.documentElement.clientHeight; // Display result inside a div element document.getElementById("result").innerHTML = "Width: " + w + ", " + "Height: " + h; } // Attaching the event listener function to window's resize event window.addEventListener("resize", displayWindowSize); // Calling the function for the first time displayWindowSize(); </script> <p><strong>Note:</strong> Please resize the browser window to see how it works.</p> </body> </html>Puede usar esto como ejemplo para obtener el resultado deseado.