blob: 372526b6e9120df3a7f46b36f26b420208743014 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
|
---
title: transitioncancel
slug: Web/API/HTMLElement/transitioncancel_event
tags:
- DOM
- Evento
- Referencia
- eventos
translation_of: Web/API/HTMLElement/transitioncancel_event
original_slug: Web/Events/transitioncancel
---
<p>{{SeeCompatTable}}</p>
<p>El evento <code>transitioncancel</code> es lanzado cuando una <a href="/en-US/docs/CSS/Using_CSS_transitions">transición CSS</a> es cancelada.</p>
<p>Véase {{domxref("GlobalEventHandlers.ontransitioncancel")}} para mas información y ejemplos.</p>
<h2 id="Información_general">Información general</h2>
<dl>
<dt>Interfaz</dt>
<dd>{{domxref("TransitionEvent")}}</dd>
<dt>Burbuja</dt>
<dd>Sí</dd>
<dt>Cancelable</dt>
<dd>No</dd>
<dt>Objetivo</dt>
<dd>{{domxref("document")}}, {{domxref("element")}}</dd>
<dt>Acción por defecto</dt>
<dd>Ninguna</dd>
</dl>
<h2 id="Propiedades">Propiedades</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Propiedad</th>
<th scope="col">Tipo</th>
<th scope="col">Descripción</th>
</tr>
</thead>
<tbody>
<tr>
<td><code>target</code> {{readonlyinline}}</td>
<td>{{domxref("EventTarget")}}</td>
<td>El objetivo del evento (the topmost target in the DOM tree).</td>
</tr>
<tr>
<td><code>type</code> {{readonlyinline}}</td>
<td>{{domxref("DOMString")}}</td>
<td>El tipo de evento.</td>
</tr>
<tr>
<td><code>bubbles</code> {{readonlyinline}}</td>
<td>{{domxref("Boolean")}}</td>
<td>Si el evento normalmente se propaga o no</td>
</tr>
<tr>
<td><code>cancelable</code> {{readonlyinline}}</td>
<td>{{domxref("Boolean")}}</td>
<td>Si el evento es cancelable o no</td>
</tr>
<tr>
<td><code>propertyName</code>{{readonlyinline}}</td>
<td>{{domxref("DOMString")}}</td>
<td>El nombre de la propiedad CSS asociada con la transición.</td>
</tr>
<tr>
<td><code>elapsedTime</code>{{readonlyinline}}</td>
<td>{{domxref("Float")}}</td>
<td>
<p>La cantidad de tiempo que ha durado la transición, en segundos, desde el momento en que el evento fué generado. Este valor no se ve afectado por el valor de <code>transition-delay</code>.</p>
</td>
</tr>
<tr>
<td><code>pseudoElement</code>{{readonlyinline}}</td>
<td>{{domxref("DOMString")}}</td>
<td>
<p>El nombre (empezando con dos "dos puntos") del pseudo-elemento CSS en el que ha ocurrido la transición (en caso de que el objetivo del evento sea dicho pseudo-elemento correspondiente al elemento), o una cadena vacía si la transición ha ocurrido en un elemento (lo que quiere decir que el objetivo del evento es dicho elemento).</p>
</td>
</tr>
</tbody>
</table>
<h2 id="Especificaciones">Especificaciones</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Especificación</th>
<th scope="col">Estado</th>
<th scope="col">Comentario</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('CSS3 Transitions', '#transitioncancel', 'transitioncancel')}}</td>
<td>{{Spec2('CSS3 Transitions')}}</td>
<td>Definición inicial.</td>
</tr>
</tbody>
</table>
<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
{{Compat("api.HTMLElement.transitioncancel_event")}}
<h2 id="Véase_también">Véase también</h2>
<ul>
<li>El manejador {{domxref("GlobalEventHandlers.ontransitioncancel")}}</li>
<li>La interfaz {{domxref("TransitionEvent")}}</li>
<li>{{event("transitionstart")}}, {{event("transitionend")}}</li>
<li>Propiedades CSS: {{cssxref("transition")}}, {{cssxref("transition-delay")}}, {{cssxref("transition-duration")}}, {{cssxref("transition-property")}}, {{cssxref("transition-timing-function")}}.</li>
</ul>
|
