I'm looking for a way to resize the Chrome browser's width with a button. Preferentially using JQuery. My goal is to show the mobile version of the website to desktop users.
I know I can do this by just resizing the BODY tag (which is definitely easier) but I got curious.
I haven't found reliable answers to this question and sorry if it has already been asked.
Other ideas are always welcome.
Recent browsers (since FF7) aren't going to support window.resizeTo(x,y) unless it's a window you created that doesn't have any other tabs. This is to prevent abusive website code.
Check the notes on this MDN Window.resizeTo() help:
Since Firefox 7, it's no longer possible for a web site to change the default size of a window in a browser, according to the following rules:
You can't resize a window or tab that wasn’t created by window.open.
You can't resize a window or tab when it’s in a window with more than one tab.
Like you mentioned, you can launch a new window with a specified size to preview a mobile experience. Alternatively, you could create an IFrame with a specified size:
<iframe src="/mobile" width="200" height="200">