替代Chrome扩展程序“Window Resizer”

Question

根据Chrome扩展程序中标题为“Window Resizer”的recent controversy (Dec 2013)，有哪些替代解决方案可以快速调整Chrome浏览器的大小以进行响应式开发测试？

Answer 1

另一种测试响应式设计的原生解决方案是使用内置的Chrome开发者工具。选择工具 - >开发人员工具，然后单击弹出窗口右下角的齿轮图标。单击“启用”，然后单击“设备指标”，您可以指定要复制的任何分辨率。

此外，通过更改该屏幕上的“用户代理”，Chrome会为所选设备设置设备指标，在决定响应断点应该位于更受欢迎的设备的位置时，这可能会非常方便。

这不像双击扩展那么容易，但它具有无扩展解决方案的优势，并且还使用实际设备的精确屏幕测量。

Answer 2

分辨率测试可能是一种可能的选择。

  

Resolution Test会更改开发人员浏览器窗口的大小   以不同的屏幕分辨率预览他们的网站。这包括   常用分辨率列表以及自定义分辨率的能力   名单。它还为用户提供了打开Goog​​le浏览器大小的选项。

可在Chrome网上商店中找到：

https://chrome.google.com/webstore/detail/resolution-test/idhfcdbheobinplaamokffboaccidbal

Answer 3

是<！/强>

我建议避免扩展，使用keyboard shortcuts掌握chrome dev工具。

使用
打开它们 F12
或
ctrl + shift + i （Gnu / Linux或Windows）
CMD + 选择 + 我（苹果机）
或
菜单＆gt;工具＆gt;开发人员工具

编辑：屏幕截图已更新，以反映chrome dev工具最近的更改。

GIF说它更好！

（提示：在新标签中打开图像）

Answer 4

要更新@ Dave的答案，从Chrome 35.0.1916.153 m开始，您需要选择齿轮图标左侧的显示抽屉图标（＆gt; =），选择来源，然后选择仿真标签。< / p>

要获取最新工具，请访问@FireCodings link到Google的移动仿真开发工具，然后下载/安装Chrome Canary。然后在Canary中选择T​​ools-＆gt; Developer Tools，单击工具窗口左上角的移动图标（位于浏览器底部），单击Sources，然后单击Emulation。这些信息位于Google页面链接上，用于演示如何使用这些工具。

Answer 5

另一种（更安全的）替代方案是让你自己。

Google在创建扩展程序方面有很多documentation。我做了这个really simple extension，它完成了项目所需的全部工作，你也可以在github找到相应的代码。

Answer 6

这是一个效果很好的窗口调整器书签：

http://lab.maltewassermann.com/viewport-resizer/

Answer 7

实际上，开发人员退出并最终从他们的扩展程序中删除了有问题的代码（称为＆＃34; Ecolinks＆＃34;）。截至今天，联盟的东西应该不见了。

来源：https://productforums.google.com/d/msg/chrome/mlAD1ygc0v0/gKLKWxoGrkIJ

版本1.9.0.3的更新日志

  

版本1.9.0.3（2014-01-15）：由于受欢迎的需求，我已删除   EcoLinks。

Answer 8

在安装了 AutoHotKey 的 Windows 上，将以下内容保存在resize-chrome.ahk中，然后双击运行：

WinMove, ahk_exe chrome.exe,, 0, 0, 1024, 768

Answer 9

尝试一次。我发现它比任何其他Chrome扩展程序都要好。

link

Answer 10

您可以直接从官方开发者网站

中的这篇文章下载扩展程序

http://windowresizer.userecho.com/topic/353032-did-you-pull-your-extension-from-the-google-store/

我试图找到一些可以使用的东西，但没有一个像这个扩展，到目前为止对我来说是最好的