---
title: Window.innerHeight
slug: Web/API/Window/innerHeight
translation_of: Web/API/Window/innerHeight
---
<div>{{APIRef}}</div>

<p>Altura (em pixels) da janela de visualização do navegador, incluindo, se renderizado, a barra de rolagem horizontal.</p>

<div class="note"><strong>Note:</strong> If you use {{ifmethod("nsIDOMWindowUtils", "setCSSViewport")}} to set the virtual window size for page layout purposes, the value returned by this property corresponds to the viewport height set using that method.</div>

<h2 id="Syntax">Syntax</h2>

<pre class="syntaxbox">var <var>intViewportHeight</var> = window.innerHeight;</pre>

<h3 id="Value">Value</h3>

<p>On return, <code>intViewportHeight</code> is the height of the browser window's viewport.</p>

<p>The <code>window.innerHeight</code> property is read only; it has no default value.</p>

<h2 id="Notes">Notes</h2>

<p>The <code>innerHeight</code> property is supported in any window object like a {{domxref("window")}}, a frame, a frameset, or a secondary window.</p>

<p>There is <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=189112#c7">an algorithm</a> to obtain the height of the viewport excluding, if rendered, the horizontal scrollbar.</p>

<h2 id="Example">Example</h2>

<h3 id="Assuming_a_frameset">Assuming a frameset</h3>

<pre class="brush:js">var intFrameHeight = window.innerHeight; // or

var intFrameHeight = self.innerHeight;
// will return the height of the frame viewport within the frameset

var intFramesetHeight = parent.innerHeight;
// will return the height of the viewport of the closest frameset

var intOuterFramesetHeight = top.innerHeight;
// will return the height of the viewport of the outermost frameset
</pre>

<p>{{todo("link to an interactive demo here")}}</p>

<p>To change the size of a window, see {{domxref("window.resizeBy()")}} and {{domxref("window.resizeTo()")}}.</p>

<p>To get the outer height of a window, i.e. the height of the whole browser window, see {{domxref("window.outerHeight")}}.</p>

<h3 id="Graphical_example">Graphical example</h3>

<p>The following figure shows the difference between <code>outerHeight</code> and <code>innerHeight</code>.</p>

<p><img alt="innerHeight vs outerHeight illustration" src="/@api/deki/files/213/=FirefoxInnerVsOuterHeight2.png"></p>

<h2 id="Specification">Specification</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('CSSOM View', '#dom-window-innerheight', 'window.innerHeight')}}</td>
   <td>{{Spec2('CSSOM View')}}</td>
   <td>Initial definition</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility">Compatibilidade com navegadores</h2>

<div>{{CompatibilityTable}}</div>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Edge</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>1</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoDesktop(1.0)}}<sup>[1]</sup></td>
   <td>9</td>
   <td>9</td>
   <td>3</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Edge</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>1</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoMobile(1.0)}}<sup>[1]</sup></td>
   <td>9</td>
   <td>9</td>
   <td>3</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] From Firefox 4 to 24 this property was buggy and could give a wrong value before page load on certain circumstances, see {{bug(641188)}}.</p>

<h2 id="See_also">See also</h2>

<ul>
 <li>{{domxref("window.innerWidth")}}</li>
 <li>{{domxref("window.outerHeight")}}</li>
 <li>{{domxref("window.outerWidth")}}</li>
</ul>