Forcer le zoom de la page à 100% avec JS
J'ai créé un petit jeu en toile, mais j'ai un problème.
Certains utilisateurs dont le zoom par défaut est réglé sur autre chose que 100% ne peuvent pas voir toute la page du jeu...
J'ai cherché sur internet une solution à ce problème mais je n'ai pas pu en trouver un...
J'ai déjà utilisé:
zoom: 100%;
en CSS.
<meta name="viewport" content="initial-scale=1.0 , minimum-scale=1.0 , maximum-scale=1.0" />
Et
style="zoom: 75%"
Quelqu'un peut-il m'aider s'il vous plait.
Merci
3 réponses
Vous pouvez définir la propriété zoom
lors du chargement de la page
document.body.style.zoom = 1.0
Mais, zoom
est pas une propriété standard pour tous les navigateurs, je recommande l'utilisation de transform
à la place.
var scale = 'scale(1)';
document.body.style.webkitTransform = scale; // Chrome, Opera, Safari
document.body.style.msTransform = scale; // IE 9
document.body.style.transform = scale; // General
Vous pouvez réinitialiser le code avec ceci:
$("input, textarea").focusout(function(){
$('meta[name=viewport]').remove();
$('head').append('<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=0">');
$('meta[name=viewport]').remove();
$('head').append('<meta name="viewport" content="width=device-width, initial-scale=yes">' );
});
Je pense que c'est une réponse très utile Comment détecter le niveau de zoom de la page dans tous les navigateurs modernes. Alors la réponse à votre question pour IE:
document.body.style.zoom = screen.logicalXDPI / screen.deviceXDPI;