Chrome扩展程序“Window Resizer”的替代方法

鉴于最近争议(2013年12月)在Chrome扩展名为“窗口调整器”,有什么替代解决scheme来快速调整Chrome浏览器的响应式开发testing?

分辨率testing可能是一个可能的select。

分辨率testing更改了浏览器窗口的大小,供开发人员以不同的屏幕分辨率预览其网站。 它包括一个常用的解决scheme列表和自定义列表的能力。 它也使用户可以select打开Goog​​le浏览器大小。

它在Chrome网上商店中可用:

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

testing响应式devise的另一个本地解决scheme是使用内置的Chrome开发者工具。 select工具 – >开发者工具,然后点击popup的窗口右下angular的齿轮图标。 点击“启用”,然后点击“设备指标”,你可以指定你想要复制的任何分辨率。

此外,通过更改该屏幕上的“用户代理”,Chrome会为所选设备设置设备指标,在决定哪些响应中断点应该用于更受欢迎的设备时,这些指标可能会派上用场。

这不像双击扩展那样容易,但是它具有作为无扩展解决scheme的优点,并且还使用实际设备的精确屏幕测量。

是!

我build议避免扩展,使用键盘快捷键掌握chrome开发工具。

打开它们使用
F12
要么
ctrl + shift + i (Gnu / Linux或Windows)
cmd + opt + i (Mac)
要么
菜单>工具>开发者工具

编辑:截图更新,以反映铬开发工具最近的变化。

截图 - 第1步(共2步)截图 - 第2步(共2步)

一个GIF说更好!

gif screencast与所有步骤 (提示:在新标签页中打开图片)

要更新@ Dave的答案,从Chrome 35.0.1916.153 m开始,您需要select齿轮图标左侧的显示抽屉图标(> =),select来源,然后select仿真选项卡。

要获得最新的工具,请将@FireCodings 链接到Google的移动模拟开发工具,并下载/安装Chrome Canary 。 然后在Canary中selectT​​ools-> Developer Tools,点击工具窗口左上angular的移动图标(位于浏览器底部),点击Sources,然后点击Emulation。 该信息位于Google页面链接上,以演示如何使用这些工具。

另一种(更安全)的select是让你自己。

Google有很多关于创build扩展的文档 。 我做了这个非常简单的扩展 ,这是我所需要的一个项目,你也可以在github上find这个代码。

这是一个窗口调整器书签,很好用:

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

实际上,开发人员退出,最终从其扩展中删除了有害的代码(称为“Ecolinks”)。 截至今天,联盟的东西应该是消失了。

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

更新日志为版本1.9.0.3

版本1.9.0.3(2014-01-15):由于受欢迎的需求,我已经删除了EcoLinks。

安装AutoHotKey的 Windows上,将下面的内容保存在resize-chrome.ahk中,然后双击运行:

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

试试这一次。 我发现它比任何其他Chrome扩展更好。

链接

您可以直接从官方开发者网站的这个职位下载扩展

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

我正在尝试find一些可以使用的东西,但没有一个像这个扩展名,对我来说是最好的