如何缩小 chrome 扩展的弹出窗口

Posted 2023-02-16

【中文标题】如何缩小 chrome 扩展的弹出窗口

【英文标题】：how to zoom out on an chrome extension's popup

【发布时间】：2016-12-30 17:28:10

【问题描述】：

某些扩展程序的弹出窗口不能很好地融入页面。如果我可以缩小弹出窗口，我可以正常使用它，但没有明显的方法可以做到这一点。

示例截图：

您可以看到弹出窗口延伸到屏幕可见部分的下方。底部有一个按钮，上面写着“记录选项卡”，我无法点击。

我的 chrome 构建：

Version 52.0.2743.116 (64-bit)
Platform 8350.68.0 (Official Build) stable-channel orco
Firmware Google_Orco.5216.362.7

所有这些都是在about://settings 菜单中将我的页面缩放设置为 100% 并将字体大小设置为中等。

将about://settings 中的页面缩放调整为 75% 将其修复了大约 30 秒，但弹出窗口很快又恢复到原来的缩放级别。

【问题讨论】：

嗯，Chrome 应该会自动限制扩展弹出窗口的大小，使其适合屏幕。不这样做肯定是一个错误，如果它还没有的话，应该在crbug.com 上报告。作为临时修复，您可以右键单击弹出窗口并在 devtools 检查器中将 max-height: 80vh; CSS 属性添加到 html 元素。

不幸的是，这并不能解决问题。文本大小相同，只是从底部进一步切断。不过我想我会提交一份错误报告。

与编程无关。试试超级用户论坛。尝试单击弹出窗口，然后键入 ctrl - (缩小)

@ZigMandel 没有用，但我注意到您的离题评论。你可以投票迁移吗？

嗯，我猜那个扩展禁用了溢出属性。那么，使用 CSS 转换：transform: scale(0.75);

【参考方案1】：

接受的答案提到进入扩展程序的选项页面以重置缩放，但许多扩展程序没有/不需要选项页面。

如果是这样的话：

打开弹出窗口 右键单击并“检查” 应该会打开一个“开发者工具”窗口，在标题栏中应该会显示弹出的 html 文件的名称和路径，如下所示：chrome-extension://[the extension ID, a long string of random letters]/popup.html 在新选项卡中打开那个长地址，它应该会显示正常的弹出内容。 （无需手动输入扩展 ID，而是可以从 chrome://extensions 复制/粘贴“开发者模式”。） 将那里的缩放重置为默认的 100% (ctrl+0)，因为大多数扩展程序开发人员会假设 100% 进行设计和测试。

这里的关键点是，缩放在所有扩展程序的页面（包括弹出窗口）中是全局/一致的，这就是缩放“选项”页面起作用的原因。从chrome-extension://[the extension ID] 开始的任何页面都将具有与所有其他页面相同的缩放并影响所有其他页面的缩放。

例如，我的扩展程序的弹出窗口有一个问号图标，该图标导航到仍在弹出窗口中的单独的 help.html 页面，并且那里的缩放也会影响主 popup.html 缩放。

这也适用于网页。缩放在同一域的所有页面上维护。如果您将一个 ***.com 问题从 125% 放大到 150%，则另一个选项卡中的另一个 ***.com 问题也将放大到 150%。

【讨论】：

我不确定这些弹出窗口是如何意外放大的，但我过去曾多次遇到过这种情况……最终弄清楚到底发生了什么真的很棘手。根据我的经验，一旦放大，即使卸载并重新安装该应用程序也无法修复它。 Chrome 会以某种方式记住缩放。

此解决方案不再有效。非常感谢一些新的建议。 Chrome 版本：78.0.3904.108 操作系统版本：Linux：4.15.0-65-generic

刚刚自己测试过，可以确认它不再起作用了。即使尝试其他答案（对于具有选项页面的扩展程序）也不起作用。我的猜测是，Chromium 团队最近做出了一项更改，强制弹出窗口为 100% 缩放，而不管扩展程序中其他页面的缩放。

【参考方案2】：

Chrome 扩展程序的缩放设置可以在该扩展程序的选项页面上进行管理：

右键点击扩展 点击选项 使用 ctrl +/- 放大或缩小

现在，点击扩展并观看魔术！

Google Chrome 会根据每个站点保存您的缩放级别。当您在扩展程序的选项页面上调整缩放级别时，该级别也适用于该扩展程序的弹出窗口。

来源：How to prevent zooming in popup window in my Chrome Extension

【讨论】：

如果您的扩展程序没有选项页面怎么办