Est-il possible d'actualiser une page sur le changement de taille du navigateur? J'utilise certains styles qui créent des zones sur une page et si le navigateur est réduit dans la mise en page.Comment puis-je actualiser l'écran lors du redimensionnement du navigateur?
Peut-être que je peux détecter le changement de taille de document avec jQuery?
Mise à jour pour toute personne qui regarde ceci maintenant. JQuery considère maintenant lier une fonction obsolète.
Et la façon dont la réponse de proximus fonctionne (au moins dans Opera/Chrome/Firefox), elle interroge constamment pour le redimensionnement même si le navigateur est juste assis là. Il semble que la fonction de redimensionnement ait été appelée automatiquement quand elle a touché location.reload(), l'amenant à frapper une boucle infinie. Voici ce que j'ai rassemblé qui a également résolu le problème.
jQuery(function($){
var windowWidth = $(window).width();
var windowHeight = $(window).height();
$(window).resize(function() {
if(windowWidth != $(window).width() || windowHeight != $(window).height()) {
location.reload();
return;
}
});
});
Il y a un événement de onresize vous pouvez écouter:
Si vous êtes à la recherche d'une solution jQuery, vous pouvez utiliser quelque chose comme ceci:
$(window).bind('resize', function() {
location.reload();
});
Peut-être fait sens d'utiliser en outre un délai d'attente ...
Dans ce cas, il n'a pas vraiment d'importance car il suffit de recharger la page lors de la première fois que le redimensionnement est appelé.Utilisez un délai d'expiration lorsque vous exécutez du code sur le redimensionnement qui peut être répété plusieurs centaines de fois par WebKit ou IE, qui déclenche beaucoup cet événement pendant le redimensionnement de la fenêtre. – RwwL
est ici une solution pure JS, parce que je pense qu'il est injuste d'utiliser pour tout jQuery.
window.addEventListener('resize', function() {
"use strict";
window.location.reload();
});
Un inconvénient est que cela ne fonctionnera pas dans IE "navigateur" de plus que 9.
+1 pour aucun jQuery – user2240431
Il suffit d'utiliser ce code
$(window).resize(function() {
window.location.href = window.location.href;
});
Espoir utile
$(window).resize(function() {
window.location.href = window.location.href;
});
Celui-ci a fonctionné pour moi!
Il y a un problème si quelqu'un fait glisser la fenêtre pour la redimensionner - il y aurait trop d'événements de redimensionnement.
Il est préférable d'utiliser la minuterie, pour nettoyer ça:
$(window).on('resize', function() {
if (timeoutId) {
clearTimeout(timeoutId);
}
timeoutId = setTimeout(function() {
location.reload();
}, 500);
});
simple. Cela ne déclenche pas plusieurs événements un seul événement toutes les x secondes. La réponse acceptée va jeter trop d'événements
var resizeTimeout;
window.addEventListener('resize', function(event) {
clearTimeout(resizeTimeout);
resizeTimeout = setTimeout(function(){
window.location.reload();
}, 1500);
});
pour jQuery remplacer window.addEventListener('resize' avec $(window).resize
magie jQuery ... ou peut-être avec un événement DOM? – Jan
Lorsque vous dites "si le navigateur est réduit", voulez-vous dire que l'utilisateur redimensionne la fenêtre du navigateur OU que l'utilisateur effectue un zoom arrière (Ctrl- ou Cmd-)? Des situations totalement différentes. – RwwL
#Check ma réponse: Son parfait et testé: http://stackoverflow.com/questions/599288/cross-browser-window-resize-event-javascript-jquery/17059269#17059269 –