window.innerWidth in Chrome's device mode
<p>When in google chrome's device mode, what does window.innerWidth return? Is it the viewport of the device (plus any scroll bars)?</p>

<p>I'm getting different values for the device's width x height (the dimensions on top of the page - the device's viewport?) and window.innerWidth x window.innerHeight (browser's viewport?). Is this supposed to happen?</p>

<p>Here's a picture of what I'm getting, and the code I used.</p>

<p><img src="https://i.imgur.com/rqbKeZu.png" alt="image"></p>

<pre><code>&lt;!doctype html&gt;
&lt;html&gt;
&lt;head&gt;&lt;/head&gt;
&lt;body&gt;
&lt;script&gt;
var image;

window.onload = function() {
  image = document.getElementById("img");
  checkWindowSize();
  window.addEventListener('resize', function(event){
    checkWindowSize();
  });
}

function checkWindowSize() {
  var width = window.innerWidth,
      height = window.innerHeight;

  console.log("window.innerHeight: ", window.innerHeight, " window.innerWidth: ", window.innerWidth);
}
&lt;/script&gt;

&lt;img id="img" class="vid-img-filter" src="http://i.imgur.com/jkhFJMn.jpg" alt=""&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>