Extension Chrome: window.innerWidth = 0? // bonus: fenêtre de maximisation

Question

Je suis en train de créer une extension chromée pour pouvoir facilement passer d'une taille d'écran à l'autre (afin de tester un design réactif). Bien que cela existe déjà, j'ai pensé que ce serait un bon exercice.

Je courais en 2 problèmes:

1. Lorsque je tente de calculer la taille du cadre (window.width - window.innerWidth), window.innerWidth affiche comme 0 dans le journal de la console.

2. Je ne trouve aucun moyen de maximiser facilement la fenêtre. Je pourrais redimensionner à screen.width et screen.height, mais ce n'est pas vraiment maximiser. Quelles sont mes options? Le site du développeur et google lui-même n'a pas retourné beaucoup d'informations utilisables.

est ici une partie de mon code:

function resize(win){ 
window = win; 
frameWidth = window.width - window.innerWidth; 
frameHeight = window.height - window.innerHeight; 
console.log(window.innerWidth); 
... 
} 

Answer 1

Je pense que ce que vous vous cherchez est window.outerWidth et window.outerHeight:

var width = window.outerWidth - fenêtre. innerWidth;

Mais vous pouvez avoir ce droit et le problème que vous pourriez rencontrer consiste à essayer de calculer la largeur de votre page d'arrière-plan. La largeur intérieure de votre page d'arrière-plan est 0 car il s'agit d'une fenêtre invisible de taille 0.

Pour obtenir la largeur externe réelle (ou innerwidth), vous devez exécuter le code dans la fenêtre visible en question. Vous pouvez le faire avec un script de contenu s'il est actif, ou vous pouvez créer une nouvelle page HTML dans votre extension, la charger dans un onglet de la fenêtre, faire les calculs et renvoyer les données à votre page d'arrière-plan avec sendRequest .

Answer 2

Vous accédez à votre page d'arrière-plan, c'est pourquoi vous avez width/height = 0. Vous devez accéder à la fenêtre en cours. Des propriétés de fenêtre sont décrites here. Par exemple, vous pouvez modifier la largeur/hauteur en utilisant:

w.width = 300; 
w.height = 200;