initial commit

6 files changed, 769 insertions, 0 deletions

diff --git a/files/pt-br/web/api/animationevent/animationevent/index.html b/files/pt-br/web/api/animationevent/animationevent/index.html
new file mode 100644
index 0000000000..77fcdeb37e
--- /dev/null
+++ b/files/pt-br/web/api/animationevent/animationevent/index.html
@@ -0,0 +1,134 @@
+---
+title: AnimationEvent()
+slug: Web/API/AnimationEvent/AnimationEvent
+tags:
+  - AnimationEvent
+  - Apps
+  - CSSOM
+  - Experimental
+  - Referencia
+translation_of: Web/API/AnimationEvent/AnimationEvent
+---
+<p>{{APIRef("Web Animations API")}}{{SeeCompatTable}}</p>
+
+<p><code><font face="Open Sans, Arial, sans-serif">O construtor </font><strong>AnimationEvent()</strong></code>retorna o recente criado {{domxref("AnimationEvent")}}, representando um evento em relação a animação.</p>
+
+<h2 id="Síntaxe">Síntaxe</h2>
+
+<pre class="syntaxbox"><em>animationEvent</em> = new AnimationEvent(<em>type</em>, {animationName: <em>aPropertyName</em>,
+                                           elapsedTime  : <em>aFloat</em>,
+                                           pseudoElement: <em>aPseudoElementName</em>});
+</pre>
+
+<h3 id="Argumentos">Argumentos</h3>
+
+<p><em>O construtor <code>AnimationEvent()</code></em><em> também herda argumentos do {{domxref("Event.Event", "Event()")}}.</em></p>
+
+<dl>
+ <dt><code>type</code></dt>
+ <dd>Um {{domxref("DOMString")}} representando o nome do tipo de <code>AnimationEvent</code>. É caso sensitivo e pode ser: <code>'animationstart'</code>, <code>'animationend'</code>, ou <code>'animationiteration'</code>.</dd>
+ <dt><code>animationName</code> {{optional_inline}}</dt>
+ <dd>Um{{domxref("DOMString")}} contendo o valor do {{cssxref("animation-name")}} propriedade CSS associada com a transição. É por padrão <code>""</code>.</dd>
+ <dt><code>elapsedTime</code> {{optional_inline}}</dt>
+ <dd>Um ponto flutuante dando a quantidade de tempo que a animação esteve rodando, em segundos, quando o evento termina, excluindo qualquer tempo que ela passou pausada. Para um evento <code>"animationstart"</code>, <code>elapsedTime</code> é <code>0.0</code> a não ser que haja um valor negativo para <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-delay" title="The animation-delay CSS property specifies when the animation should start. This lets the animation sequence begin some time after it's applied to an element.">animation-delay</a></code>, nesse caso o evento terminará com <code>elapsedTime contendo</code>  <code>(-1 * </code><em>delay</em><code>)</code>. É por padrão <code>0.0</code>.</dd>
+ <dt><code>pseudoElement</code> {{optional_inline}}</dt>
+ <dd>É um <code>{{domxref("DOMString")}}</code>, começando com<code>"::"</code>, contendo o nome do <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements" title="/en-US/docs/Web/CSS/Pseudo-elements">pseudo-element</a> que a animação roda. Se a animação não roda em um pseudo-elementomas em um elemento, então temos um <em>string</em> vazio <code>"" .</code>É por padrão <code>""</code>. </dd>
+</dl>
+
+<h2 id="Especificações">Especificações</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificações</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentário</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ SpecName('CSS3 Animations', '#AnimationEvent-interface', 'AnimationEvent()') }}</td>
+   <td>{{ Spec2('CSS3 Animations')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidade_com_os_Navegadores">Compatibilidade com os Navegadores</h2>
+
+<p><code>{{ CompatibilityTable() }}</code></p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(43.0)}}</td>
+   <td>{{ CompatGeckoDesktop("23.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>pseudoElement</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoDesktop("23.0") }}</td>
+   <td>
+    <p>{{CompatNo}}</p>
+   </td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("23.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+  </tr>
+  <tr>
+   <td><code>pseudoElement</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("23.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Veja_também">Veja também </h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_animations">Usando animações CSS</a>.</li>
+ <li>Tópicos relacionados a animação CSS, propriedades e regras: <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation" title="The animation CSS property is a shorthand property for animation-name, animation-duration, animation-timing-function, animation-delay, animation-iteration-count and animation-direction.">animation</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-delay" title="The animation-delay CSS property specifies when the animation should start. This lets the animation sequence begin some time after it's applied to an element.">animation-delay</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction" title="The animation-direction CSS property indicates whether the animation should play in reverse on alternate cycles.">animation-direction</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-duration" title="The animation-duration CSS property specifies the length of time that an animation should take to complete one cycle.">animation-duration</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-fill-mode" title="The animation-fill-mode CSS property specifies how a CSS animation should apply styles to its target before and after it is executing.">animation-fill-mode</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-iteration-count" title="The animation-iteration-count CSS property defines the number of times an animation cycle should be played before stopping.">animation-iteration-count</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-name" title="The animation-name CSS property specifies a list of animations that should be applied to the selected element. Each name indicates a @keyframes at-rule that defines the property values for the animation sequence.">animation-name</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-play-state" title="The animation-play-state CSS property determines whether an animation is running or paused. You can query this property's value to determine whether or not the animation is currently running; in addition, you can set its value to pause and resume playback of an animation.">animation-play-state</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-timing-function" title="The CSS animation-timing-function property specifies how a CSS animation should progress over the duration of each cycle. The possible values are one or several &lt;timing-function>.">animation-timing-function</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@keyframes" title="The @keyframes CSS at-rule lets authors control the intermediate steps in a CSS animation sequence by establishing keyframes (or waypoints) along the animation sequence that must be reached by certain points during the animation. This gives you more specific control over the intermediate steps of the animation sequence than you get when letting the browser handle everything automatically.">@keyframes</a></code></li>
+ <li>The {{domxref("AnimationEvent")}} interface it belongs to.</li>
+</ul>
diff --git a/files/pt-br/web/api/animationevent/animationname/index.html b/files/pt-br/web/api/animationevent/animationname/index.html
new file mode 100644
index 0000000000..62a739e4e2
--- /dev/null
+++ b/files/pt-br/web/api/animationevent/animationname/index.html
@@ -0,0 +1,102 @@
+---
+title: AnimationEvent.animationName
+slug: Web/API/AnimationEvent/animationName
+tags:
+  - AnimationEvent
+  - Animação Web
+  - Apps
+  - CSSOM
+  - Propriedade
+  - Referencia
+translation_of: Web/API/AnimationEvent/animationName
+---
+<p><code>{{SeeCompatTable}}{{ apiref("Web Animations API") }}</code></p>
+
+<p><code><font face="Open Sans, Arial, sans-serif">O </font><strong>AnimationEvent.animationName </strong></code>é uma propriedade só de leitura do{{domxref("DOMString")}} contendo o valor de {{cssxref("animation-name")}} propriedade CSS relacionada com a trasição.</p>
+
+<h2 id="Síntaxe">Síntaxe</h2>
+
+<pre class="syntaxbox"><em>name</em> = <em>AnimationEvent</em>.animationName</pre>
+
+<h2 id="Especificações">Especificações</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificação</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentário</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>{{ SpecName('CSS3 Animations', '#AnimationEvent-animationName', 'AnimationEvent.animationName') }}</code></td>
+   <td><code>{{ Spec2('CSS3 Animations')}}</code></td>
+   <td><code>Initial definition.</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidade_com_os_Navegadores">Compatibilidade com os Navegadores</h2>
+
+<p><code>{{CompatibilityTable}}</code></p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("6.0") }}</td>
+   <td>10.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<p> </p>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_animations">Usando animações CSS</a></li>
+ <li>{{cssxref("animation")}}, {{cssxref("animation-delay")}}, {{cssxref("animation-direction")}}, {{cssxref("animation-duration")}}, {{cssxref("animation-fill-mode")}}, {{cssxref("animation-iteration-count")}}, {{cssxref("animation-name")}}, {{cssxref("animation-play-state")}}, {{cssxref("animation-timing-function")}}, {{cssxref("@keyframes")}}.</li>
+ <li>The {{domxref("AnimationEvent")}} interface it belongs to.</li>
+</ul>
diff --git a/files/pt-br/web/api/animationevent/elapsedtime/index.html b/files/pt-br/web/api/animationevent/elapsedtime/index.html
new file mode 100644
index 0000000000..4d04b30c90
--- /dev/null
+++ b/files/pt-br/web/api/animationevent/elapsedtime/index.html
@@ -0,0 +1,103 @@
+---
+title: AnimationEvent.elapsedTime
+slug: Web/API/AnimationEvent/elapsedTime
+tags:
+  - AnimationEvent
+  - Animações Web
+  - Apps
+  - CSSOM
+  - Experimental
+  - Propriedade
+  - Referencia
+translation_of: Web/API/AnimationEvent/elapsedTime
+---
+<p>{{SeeCompatTable}}{{ apiref("Web Animations API") }}</p>
+
+<h2 id="Sumário">Sumário</h2>
+
+<p>O <code><strong>AnimationEvent.elapsedTime</strong></code> é uma propriedade só de leitura com um ponto flutuante dando a quantidade de tempo que animação esteve rodando, em segundos, quando o evento termina, excluirá o tempo em que ela esteve em pausa. Para um evento <code>"animationstart" </code>, <code>elapsedTime</code> é <code>0.0</code> a não ser que tenha um valor negativo para {{cssxref("animation-delay")}}, nesse caso o evento irá terminar com <code>elapsedTime</code> contendo <code>(-1 * </code><em>delay</em><code>)</code>.</p>
+
+<h2 id="Síntaxe">Síntaxe</h2>
+
+<pre class="syntaxbox">time = <em>AnimationEvent</em>.elapsedTime</pre>
+
+<h2 id="Especificações">Especificações</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('CSS3 Animations', '#AnimationEvent-elapsedTime', 'AnimationEvent.elapsedTime') }}</td>
+   <td>{{ Spec2('CSS3 Animations')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidade_com_os_Navegadores">Compatibilidade com os Navegadores</h2>
+
+<p>{{ CompatibilityTable }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("6.0") }}</td>
+   <td>10.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("6.0") }}</td>
+   <td>10.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"> </h2>
+
+<h2 id="Veja_também">Veja também</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_animations">Usando animações CSS.</a></li>
+ <li>Animation-related CSS properties and at-rules: {{cssxref("animation")}}, {{cssxref("animation-delay")}}, {{cssxref("animation-direction")}}, {{cssxref("animation-duration")}}, {{cssxref("animation-fill-mode")}}, {{cssxref("animation-iteration-count")}}, {{cssxref("animation-name")}}, {{cssxref("animation-play-state")}}, {{cssxref("animation-timing-function")}}, {{cssxref("@keyframes")}}.</li>
+ <li>The {{domxref("AnimationEvent")}} interface it belongs to.</li>
+</ul>
diff --git a/files/pt-br/web/api/animationevent/index.html b/files/pt-br/web/api/animationevent/index.html
new file mode 100644
index 0000000000..c2abeb0bf6
--- /dev/null
+++ b/files/pt-br/web/api/animationevent/index.html
@@ -0,0 +1,194 @@
+---
+title: AnimationEvent
+slug: Web/API/AnimationEvent
+tags:
+  - API
+  - Animação Web
+  - Experimental
+  - Expérimental(2)
+  - Interface
+  - NeedsTranslation
+  - Reference
+  - Referencia
+  - Référence(2)
+  - TopicStub
+translation_of: Web/API/AnimationEvent
+---
+<p>{{SeeCompatTable}}{{APIRef("Web Animations API")}}</p>
+
+<p>A interface <strong><code>AnimationEvent</code></strong>  representa eventos provendo informações relacionadas a <a href="/en-US/docs/Web/Guide/CSS/Using_CSS_animations/">animações</a>.</p>
+
+<p><code>{{InheritanceDiagram}}</code></p>
+
+<h2 id="Propriedades">Propriedades</h2>
+
+<p><em>Também propriedades herdadas pelo pai <code>{{domxref("Event")}}</code></em>.</p>
+
+<dl>
+ <dt><code>{{domxref("AnimationEvent.animationName")}} {{readonlyInline}}</code></dt>
+ <dd>O {{domxref("DOMString")}} contém o valor do {{cssxref("animation-name")}} propriedade CSS associada com a transição.</dd>
+ <dt><code>{{domxref("AnimationEvent.elapsedTime")}} {{readonlyInline}}</code></dt>
+ <dd><code><font face="Open Sans, Arial, sans-serif">É um ponto flutuante</font></code> dado pela quantidade de tempo que a animação está rodando, em segundos, quando esse evento termina, excluindo o tempo em que animação esteve pausada. Para o evento <code>"animationstart"</code>, <code>elapsedTime</code> é <code>0.0</code> a não ser que haja um valor negativo para <code>{{cssxref("animation-delay")}}</code>, nesse caso o evento terminará com <code>elapsedTime</code> contendo  <code>(-1 * </code><em>delay</em><code>)</code>.</dd>
+ <dt><code>{{domxref("AnimationEvent.pseudoElement")}} {{readonlyInline}}</code></dt>
+ <dd>Um<code> {{domxref("DOMString")}} </code>começa com  <code>'::'</code>, contendo o nome do <a href="/en-US/docs/Web/CSS/Pseudo-elements">pseudo-elemento</a> onde a animação roda. Se a animação não rodar no pseudo-elemento mas no elemento, então teremos um <em>string </em>vazio <code>' '</code>.</dd>
+</dl>
+
+<h2 id="Constructores">Constructores</h2>
+
+<dl>
+ <dt><code>{{domxref("AnimationEvent.AnimationEvent", "AnimationEvent()")}}</code></dt>
+ <dd>Cria um evento <code>AnimationEvent</code> com os dados parâmetros.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<p><em>Também herda métodos do pai <code>{{domxref("Event")}}</code></em>.</p>
+
+<dl>
+ <dt><code>{{domxref("AnimationEvent.initAnimationEvent()")}} {{non-standard_inline}}{{deprecated_inline}}</code></dt>
+ <dd>Inicializa um <code>AnimationEvent criado usando diminuído </code>{{domxref("Document.createEvent()", "Document.createEvent(\"AnimationEvent\")")}} método.</dd>
+</dl>
+
+<h2 id="Especificações">Especificações</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificação</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentário</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ SpecName('CSS3 Animations', '#AnimationEvent-interface', 'AnimationEvent') }}</td>
+   <td>{{ Spec2('CSS3 Animations') }}</td>
+   <td>Definição inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidade_com_o_Navegador">Compatibilidade com o Navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>
+    <p>1.0 {{ property_prefix("webkit") }}</p>
+
+    <p>{{CompatChrome(43.0)}}</p>
+   </td>
+   <td>{{ CompatGeckoDesktop("6.0") }}</td>
+   <td>10.0</td>
+   <td>12 {{ property_prefix("o") }}<br>
+    12.10<br>
+    15.0 {{ property_prefix("webkit") }}</td>
+   <td>4.0 {{ property_prefix("webkit") }}</td>
+  </tr>
+  <tr>
+   <td>AnimationEvent() constructor</td>
+   <td>
+    <p>{{CompatChrome(43.0)}}</p>
+   </td>
+   <td>{{ CompatGeckoDesktop("23.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>initAnimationEvent() {{non-standard_inline}}{{deprecated_inline}}</td>
+   <td>1.0</td>
+   <td>{{ CompatGeckoDesktop("6.0") }}<br>
+    Removed in {{ CompatGeckoDesktop("23.0") }}</td>
+   <td>10.0</td>
+   <td>12</td>
+   <td>4.0</td>
+  </tr>
+  <tr>
+   <td>pseudoelement</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoDesktop("23.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<p> </p>
+
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}{{ property_prefix("webkit") }}</td>
+   <td>{{ CompatGeckoMobile("6.0") }}</td>
+   <td>10.0</td>
+   <td>12 {{ property_prefix("o") }}<br>
+    12.10<br>
+    15.0 {{ property_prefix("webkit") }}</td>
+   <td>{{CompatVersionUnknown}}{{ property_prefix("webkit") }}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+  </tr>
+  <tr>
+   <td>AnimationEvent() constructor</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("23.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+  </tr>
+  <tr>
+   <td>initAnimationEvent() {{non-standard_inline}}{{deprecated_inline}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("6.0") }}<br>
+    Removed in {{ CompatGeckoMobile("23.0") }}</td>
+   <td>10.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>pseudoelement</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("23.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"> </h2>
+
+<h2 id="Veja_também">Veja também</h2>
+
+<ul>
+ <li><a href="/en-US/docs/CSS/Using_CSS_animations">Usando animações CSS</a></li>
+</ul>
diff --git a/files/pt-br/web/api/animationevent/initanimationevent/index.html b/files/pt-br/web/api/animationevent/initanimationevent/index.html
new file mode 100644
index 0000000000..e9b0819b98
--- /dev/null
+++ b/files/pt-br/web/api/animationevent/initanimationevent/index.html
@@ -0,0 +1,134 @@
+---
+title: AnimationEvent.initAnimationEvent()
+slug: Web/API/AnimationEvent/initAnimationEvent
+tags:
+  - AnimationEvent
+  - Apps
+  - CSSOM
+  - Método(2)
+  - Não-padrão
+  - Obsolento
+  - Web Animations
+translation_of: Web/API/AnimationEvent/initAnimationEvent
+---
+<p>{{obsolete_header}}{{non-standard_header}}{{ apiref("Web Animations API") }}</p>
+
+<h2 id="Sumário">Sumário</h2>
+
+<p>O <code><strong>AnimationEvent.initAnimationEvent() </strong></code>é um método iniciado com o evento da animção criando um depreciativo {{domxref("Document.createEvent()", "Document.createEvent(\"AnimationEvent\")")}} método.</p>
+
+<p><code>AnimationEvent</code> criado desse modo não é confiável.</p>
+
+<div class="note">
+<p><strong>Note:</strong> Durante o processo de padronização, esse método foi removido das especificações. É que ele foi depreciado e esse processo foi removido da maioria das implementações . <strong>Não use este método</strong>; ao invés, use o construtor padrão, {{domxref("AnimationEvent.AnimationEvent", "AnimationEvent()")}}, para criar um sintético {{domxref("AnimationEvent")}}.</p>
+</div>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><em>animationEvent</em>.initAnimationEvent(<em>typeArg</em>, <em>canBubbleArg</em>, <em>cancelableArg</em>, <em>animationNameArg</em>, <em>elapsedTimeArg</em>);</pre>
+
+<h3 id="Parâmetros">Parâmetros</h3>
+
+<dl>
+ <dt><code>typeArg</code></dt>
+ <dd>Um {{domxref("DOMString")}} identificado com um tipo específico de evento animação que ocorreu. Os seguintes valores são aceitados:
+ <table class="standard-table">
+  <thead>
+   <tr>
+    <th scope="col">Valor</th>
+    <th scope="col">Significado</th>
+   </tr>
+  </thead>
+  <tbody>
+   <tr>
+    <td><code>animationstart</code></td>
+    <td>A animação começou.</td>
+   </tr>
+   <tr>
+    <td><code>animationend</code></td>
+    <td>A animação terminou.</td>
+   </tr>
+   <tr>
+    <td><code>animationiteration</code></td>
+    <td>A iteração corrente se completou.</td>
+   </tr>
+  </tbody>
+ </table>
+ </dd>
+ <dt><code>canBubbleArg</code></dt>
+ <dd>Uma {{domxref("Boolean")}} bandeira indicando se o evento pode ser bolha (<code>true</code>) ou não (<code>false)</code>.</dd>
+ <dt><code>cancelableArg</code></dt>
+ <dd>Uma {{domxref("Boolean")}} bandeira indicando se o evento associado pode ser evitado (<code>true</code>) ou não (<code>false)</code>.</dd>
+ <dt><code>animationNameArg</code></dt>
+ <dd>Um {{domxref("DOMString")}} contendo o valor do{{cssxref("animation-name")}} propriedade CSS associada com a transição.</dd>
+ <dt><code>elapsedTimeArg</code></dt>
+ <dd>Um ponto flutuante indicando a quantidade de tempo que a animação esteve rodando, em segundos, com o tempo do evento terminar, excluirá-se o tempo em que a animação esteve em pausa.Para um <code>"animationstart"</code> evento, <code>elapsedTime</code> é <code>0.0</code> a não ser que haja um valor negativo para <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/animation-delay" title="The animation-delay CSS property specifies when the animation should start. This lets the animation sequence begin some time after it's applied to an element.">animation-delay</a></code>, nesse caso o evento irá terminar com <code>elapsedTime</code> contendo <code>(-1 * </code><em>delay</em><code>)</code>.</dd>
+</dl>
+
+<h2 id="Especificações">Especificações</h2>
+
+<p><em>Esse método é não-padrão e não é parte de qualquer especificação, no entanto ele esteve presente nos primeiros rascunhos de {{SpecName("CSS3 Animations")}}.</em></p>
+
+<h2 id="Compatibilidade_com_os_Navegadores">Compatibilidade com os Navegadores</h2>
+
+<p>{{ CompatibilityTable }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("6.0") }}<br>
+    Removed in {{ CompatGeckoDesktop("23.0") }}</td>
+   <td>10.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<p> </p>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</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>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("6.0") }}<br>
+    Removed in {{ CompatGeckoMobile("23.0") }}</td>
+   <td>10.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_animations">Using CSS animations</a></li>
+ <li>Animation-related CSS properties and at-rules: {{cssxref("animation")}}, {{cssxref("animation-delay")}}, {{cssxref("animation-direction")}}, {{cssxref("animation-duration")}}, {{cssxref("animation-fill-mode")}}, {{cssxref("animation-iteration-count")}}, {{cssxref("animation-name")}}, {{cssxref("animation-play-state")}}, {{cssxref("animation-timing-function")}}, {{cssxref("@keyframes")}}.</li>
+ <li>The {{domxref("AnimationEvent")}} interface it belongs to.</li>
+</ul>
diff --git a/files/pt-br/web/api/animationevent/pseudoelement/index.html b/files/pt-br/web/api/animationevent/pseudoelement/index.html
new file mode 100644
index 0000000000..0e68a22532
--- /dev/null
+++ b/files/pt-br/web/api/animationevent/pseudoelement/index.html
@@ -0,0 +1,102 @@
+---
+title: AnimationEvent.pseudoElement
+slug: Web/API/AnimationEvent/pseudoElement
+tags:
+  - AnimationEvent
+  - Animação Web
+  - Apps
+  - CSSOM
+  - Propriedade
+  - Referencia
+translation_of: Web/API/AnimationEvent/pseudoElement
+---
+<p>{{SeeCompatTable}}{{ apiref("Web Animations API") }}</p>
+
+<h2 id="Sumário">Sumário</h2>
+
+<p>O <code><strong>AnimationEvent.pseudoElement</strong></code> é uma propriedade só de leitura do {{domxref("DOMString")}}, começando com <code>'::'</code>, contendo o nome do <a href="/en-US/docs/Web/CSS/Pseudo-elements" title="/en-US/docs/Web/CSS/Pseudo-elements">pseudo-element</a> em que a animação roda. Se a animação não roda em um pseudo-elemento mas em um elemento, então temos uma<em> string</em> vazia : <code>''</code><code>.</code></p>
+
+<h2 id="Síntaxe">Síntaxe</h2>
+
+<pre class="syntaxbox"><em>name</em> = <em>AnimationEvent</em>.pseudoElement</pre>
+
+<h2 id="Especificações">Especificações</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificação</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentário</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ SpecName('CSS3 Animations', '#AnimationEvent-pseudoElement', 'AnimationEvent.pseudoElement') }}</td>
+   <td>{{ Spec2('CSS3 Animations')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidade_com_os_Navegadores">Compatibilidade com os Navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoDesktop("23.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<p> </p>
+
+<p> </p>
+
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</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>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("23.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_animations">Using CSS animations</a></li>
+ <li>{{cssxref("animation")}}, {{cssxref("animation-delay")}}, {{cssxref("animation-direction")}}, {{cssxref("animation-duration")}}, {{cssxref("animation-fill-mode")}}, {{cssxref("animation-iteration-count")}}, {{cssxref("animation-name")}}, {{cssxref("animation-play-state")}}, {{cssxref("animation-timing-function")}}, {{cssxref("@keyframes")}}.</li>
+ <li>The {{domxref("AnimationEvent")}} interface it belongs to.</li>
+</ul>