Chrome 扩展：window.innerWidth = 0 ？ // 奖励：最大化窗口
我正在创建一个 chrome 扩展，以便在不同的屏幕尺寸之间轻松切换（以便测试响应式设计）。尽管这已经存在，但我认为这将是一个很好的练习。
我遇到了 2 个问题：
当我尝试计算框架的大小 (window.width - window.innerWidth) 时，window.innerWidth 在控制台日志中显示为 0。
我找不到任何方法可以轻松最大化窗口。我可以调整大小到 screen.width 和 screen.height，但这并没有真正最大化。我有什么选择？开发者网站和谷歌本身没有返回太多有用的信息。
这是我的一些代码：
function resize(win){
window = win;
frameWidth = window.width - window.innerWidth;
frameHeight = window.height - window.innerHeight;
console.log(window.innerWidth);
...
}
I am creating a chrome extension to easily swap between different screen sizes (in order to test responsive design). Although this already exists, I figured it would be a good excercise.
I am running into 2 problems:
When I try to calculate the size of the frame (window.width - window.innerWidth), window.innerWidth displays as 0 in the console log.
I cannot find any way to easily maximize the window. I could resize to screen.width and screen.height, but that's not really maximizing. What are my options? The developer site and google itself didn't return much usable info.
Here's some of my code:
function resize(win){
window = win;
frameWidth = window.width - window.innerWidth;
frameHeight = window.height - window.innerHeight;
console.log(window.innerWidth);
...
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您正在访问背景页面，这就是宽度/高度 = 0 的原因。您必须访问当前窗口。
此处介绍了窗口属性。例如，您可以使用以下方法修改宽度/高度：
You are accessing your background page, that's why you have width/height = 0. You have to access the current window.
Window properties are described here. For instance, you can modify width/height by using:
我认为您正在寻找的是 window.outerWidth 和 window.outerHeight:
var width = window.outerWidth - window.innerWidth;
但您可能拥有此权利，并且您可能遇到的问题是尝试计算背景页面的宽度。背景页面的innerWidth 为0，因为它是一个不可见的0 大小窗口。
要获取实际的outerWidth（或innerWidth），您需要在相关的可见窗口中执行代码。如果内容脚本处于活动状态，您可以使用内容脚本来执行此操作，或者您可以在扩展程序中创建一个新的 HTML 页面，将其加载到窗口的选项卡中，让它进行计算并使用 sendRequest 将数据发送回后台页面。
I think what you're looking for is window.outerWidth and window.outerHeight:
var width = window.outerWidth - window.innerWidth;
But you may have this right and the problem you might be running into is trying to calculate the width from your background page. The innerWidth from your background page is 0 because it's an invisible 0-size window.
To get the actual outerWidth (or innerWidth), you need to execute the code in the visible window in question. You can do this with a content script if one is active, or you can create a new HTML page in your extension, load it in a tab in the window, have it do the calculations and send the data back to your background page with sendRequest.