I frequently use the overrides tab in Chrome Developer tools to emulate other device such IPhone and IPad, but after upgrading to last version (32.0.1700.76 m) everything in the overrides tab is gone and replaced by a checkbox saying "Show 'Emulation' view in console drawer".
Checking this checkbox does not enable a 'Emulation' view in the Console drawer. The "Show Console" button seems to be disabled.
Chrome let's you add new emulated mobile devices by opening the Developer Tools pane (View > Developer > Developer Tools), going to Settings (F1) then Devices and clicking the Add custom device button.
Open Chrome, press Ctrl+Shift+j and it opens the JavaScript console where you can write and test your code.
To open the developer console in Google Chrome, open the Chrome Menu in the upper-right-hand corner of the browser window and select More Tools > Developer Tools. You can also use Option + ⌘ + J (on macOS), or Shift + CTRL + J (on Windows/Linux).
See here for more information.
Before starting open the dev tools console (on a Mac cmd-option-i)
There is also a note in the link above stating:
Note: Emulation tools within DevTools were previously contained within an Overrides pane inside the Settings panel. The Emulation panel is the new Overrides pane.
After installing Chrome (or the bleeding edge version Chrome Canary) you should be able to do proper mobile emulation within Chrome's Developer Tools. I usually activate them by Right Clicking > Inspect Element
For visual learners like myself, I just included a full screenshot.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With