PDA

View Full Version : Working with Layout and Graphical Design



SimonFlack
18 Jul 2012, 8:56 AM
Hey guys.

I have been doing a bit of mobile work lately and came across a little trick that has really made my life a lot easier.

I am using Safari now (This did not work in chrome)
window.resizeTo(320,556)

Note: I am using a mac where the minimum browser window width seems to be 400px.

This pretty much gives you a perfect iPhone size that you can use to fine tune your design without having to deploy to your phone to test.

Anyway... Just thought I would post it.

37294

estesbubba
18 Jul 2012, 9:42 AM
I use this extension on Chrome for different device sizes:

https://chrome.google.com/webstore/detail/kkelicaakdanhinjdeammmilcgefonfh

SimonFlack
18 Jul 2012, 9:50 AM
Yeah. I tried that.

The 320x480 iphone setting did not work for me. Resulting width was 400px (standard minimum on mac)

Maybe its mac issue.

estesbubba
18 Jul 2012, 10:17 AM
If you have a bunch of extension icons it won't allow the browser to shrink beyond a minimum width. If you increase the omnibar size (which hides the icons) it will. Also, there is an option to have the size be the viewport or actual browser window.

estesbubba
18 Jul 2012, 10:52 AM
BTW, I'm on Windows so it could be different on Mac

kostysh
19 Jul 2012, 12:45 PM
try "Ripple Emulator" Google Chrome extension:
https://chrome.google.com/webstore/detail/geelfhphabnejjhdalkjhgipohgpdnoc?hl=en-US&utm_source=chrome-ntp-launcher

not page resizing only but more tools for mobile apps testing