How to simulate a higher resolution screen? [closed]
Is there any way for the browser to test my websites in resolutions that are higher than my screens?
E.g: I have a 1440 x 900 screen, and I want to test the website in 1920 x 1200, 1920 x 1080, etc.
[Edit: Check your browser's devtools first! As @SkylarIttner points out in the comments, tools for responsive design testing have been rolled out since in most browsers since the below solution was posted. They are likely the best/easiest option now.]
You could, correct me if I'm wrong, simply create an iframe with style="desired width & height" and src="your/test.site" as the only child of <body>. Should display the site as if the resolution was the specified width/height and result in scroll bars to examine it.
Not as convenient as using a third party, having to set it up yourself, but has the advantage of being able to test locally with no internet connection.
This solution is way faster than the ones proposed above:
http://www.infobyip.com/testwebsiteresolution.php
It's not as versatile as browsershots.org but it's much faster (a few seconds v. a 45 minute queue).
Some ideas:
Use browser zoom, 1024x768 50% zoom = 2048x1536 simulated resolution, I know Chrome resizes images and the like. Things become hard to read, but I'm assuming you're testing placement and such.
Also you can use some screenshot programs to take higher than normal resolution screenshots (fireshot on Firefox let me do this, but had memory issues with really high resolutions, and isn't free anymore).
One solution, perhaps overkill, would be to use Xvfb: set the desired resolution and color depth, load your page in browser(s) and take screenshot(s).
Although this won't tell you the exact resolution your testing, you can use the zoom tool in Chrome or FF to zoom out. This will give a fairly accurate idea of what the site looks like on higher res screens.
You may want to try wkhtmltoimage, which can take screenshots at arbitrary resolutions.
Also, in KDE4 it is possible to enlarge a window beyond the screen size. I think I have seen it in Windows 7 too. Not sure about other OSes.
IE9 allows you to resize the browser window to an arbitrary size: Press F12 for developer tools, go to Tools | Resize and pick your preferred size. Then use some tool that can capture off-screen windows if the window is bigger than your screen. This article seems to indicate that Snagit can do this. Then just take a look at the captured pic.
加载中,请稍侯......
精彩评论