Detect window change of resolution

In JavaScript we have an event handler for the resizing event of window , the window.onresize (English) .

window.onresize = function(){
   location.reload();
};

But attention:

Turning on a page refresh while changing the screen size is tricky, because while we are resizing, the page reloads, re-detects the change, reloads ...

The solution is to ensure that the size change is over and then call the update:

function recarregarPagina(){
    // Sem redimencionamento à 100ms!
    location.reload();
}

var boraLa;
window.onresize = function(){
  clearTimeout(boraLa);
  boraLa = setTimeout(recarregarPagina, 100);
};

Here, using setTimeout() (English ) and clearTimeout() (English) We are checking every 100 milliseconds if the page is still being resized. If it's over, we call our function recarregarPagina() .

While the user is resizing the screen, the timer is always set to 0 (zero). When the user stops resizing the screen, after 100 milliseconds our recarregarPagina() function is called. Inside it we have the code to execute, in your case: location.reload(); .

If you can use JQuery:

$(window).resize(function() {
  // código que será executado quando o browser for redimensionado.
});

See: JQuery - .resize method

//recarrega a pagina se mudar a resolução.
$( window ).resize(function() {
  document.location.reload();
});//