initial commit

1 files changed, 84 insertions, 0 deletions

diff --git a/files/pt-br/web/api/element/getboundingclientrect/index.html b/files/pt-br/web/api/element/getboundingclientrect/index.html
new file mode 100644
index 0000000000..5f32a3512a
--- /dev/null
+++ b/files/pt-br/web/api/element/getboundingclientrect/index.html
@@ -0,0 +1,84 @@
+---
+title: Element.getBoundingClientRect()
+slug: Web/API/Element/getBoundingClientRect
+tags:
+  - API
+  - CSSOM View
+  - Método(2)
+  - Referência(2)
+translation_of: Web/API/Element/getBoundingClientRect
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p>O método <code><strong>Element.getBoundingClientRect() </strong>retorna o tamanho de um elemento e sua posição relativa ao <em>viewport</em>.</code></p>
+
+<h2 id="Sintaxe">Sintaxe</h2>
+
+<pre class="syntaxbox"><var>rectObject</var> = <var>object</var>.getBoundingClientRect();
+</pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>O valor de retorno é o objeto <a href="/en-US/docs/XPCOM_Interface_Reference/nsIDOMClientRect">DOMRect</a> que é a uniāo dos retângulos retornados por <a href="/en-US/docs/DOM/element.getClientRects"><code>getClientRects()</code></a> para o elemento, ou seja, os atributos border-boxes do CSS associados ao elemento.</p>
+
+<p>O valor retornado é um objeto <code>DOMRect</code>, que contém as propriedades apenas-leitura <code>left</code>, <code>top</code>, <code>right</code> e <code>bottom</code> que descrevem o border-box em pixels. <code>top</code> e <code>left</code> são relativos às propriedades top-left do <em>viewport</em>.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> {{Gecko("1.9.1")}} adiciona as propriedades <code>width</code> e <code>height</code> ao objeto <code>DOMRect</code>.</p>
+</div>
+
+<p>Border-boxes vazias são completamente ignoradas. Se todos os border-boxes do elemento são vazias, então é retornado o retângulo com width e height como zero, e no lugar de <code>top</code> e <code>left</code> determina-se o top-left do border-box relacionado ao primeiro box CSS (determinado pela ordem do conteúdo) em relaçāo ao elemento.</p>
+
+<p>A quantidade de scrolling que foi feita na área do viewport (ou qualquer outra área de qualquer outro elemento <em>scrollable</em>) é tomada com medida ao computar o delimitador do retângulo. Isso significa que as propriedades <code>top</code> e <code>left</code> mudam seus valores tão logo a posiçāo do scroll for alterada (assim seus valores sāo relativos ao viewport e não são absolutos). Se esse não for o comportamento esperado basta adicionar a posição atual do scroll para as propriedades <code>top</code> e <code>left</code> (via <code>window.scrollX</code> e <code>window.scrollY</code>) para pegar os valores constantes independentemente da posiçāo atual do scroll.</p>
+
+<p>Scripts que requerem uma alta compatibilidade cross-browser podem usar <code>window.pageXOffset</code> e <code>window.pageYOffset</code> ao invés de <code>window.scrollX</code> e <code>window.scrollY.</code> Scripts sem acesso ao <code>window.pageXOffset</code>, <code>window.pageYOffset</code>, <code>window.scrollX</code> e <code>window.scrollY</code> podem usar:</p>
+
+<pre class="brush:js">// Para o scrollX
+(((t = document.documentElement) || (t = document.body.parentNode))
+  &amp;&amp; typeof t.ScrollLeft == 'number' ? t : document.body).ScrollLeft
+// Para o scrollY
+(((t = document.documentElement) || (t = document.body.parentNode))
+  &amp;&amp; typeof t.ScrollTop == 'number' ? t : document.body).ScrollTop
+</pre>
+
+<h2 id="Exemplo">Exemplo</h2>
+
+<pre class="brush:js">// rect é um objeto DOMRect com seis propriedades: left, top, right, bottom, width, height
+var rect = obj.getBoundingClientRect();
+</pre>
+
+<h2 id="Especificaçōes">Especificaçōes</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificação</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentário</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("CSSOM View", "#dom-element-getboundingclientrect", "Element.getBoundingClientRect()")}}</td>
+   <td>{{Spec2("CSSOM View")}}</td>
+   <td>Definiçāo Inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Notas">Notas</h3>
+
+<p><code>getBoundingClientRect()</code> foi primeiramente introduzida no modelo de objeto MS IE DHTML.</p>
+
+<p>O valor de retorno de <code>getBoundingClientRect()</code> é <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze">frozen</a>.</p>
+
+<h2 id="Compatibilidade">Compatibilidade</h2>
+
+<div>{{Compat("api.Element.getBoundingClientRect")}}</div>
+
+<h2 id="Veja_também">Veja também</h2>
+
+<ul>
+ <li><a href="https://msdn.microsoft.com/en-us/library/ms536433(VS.85).aspx">MSDN: <code>getBoundingClientRect</code></a></li>
+ <li><a href="/en-US/docs/DOM/element.getClientRects"><code>getClientRects()</code></a></li>
+</ul>