aboutsummaryrefslogtreecommitdiff
path: root/files/es/web/api/texttrack
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:45 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:45 -0500
commit1109132f09d75da9a28b649c7677bb6ce07c40c0 (patch)
tree0dd8b084480983cf9f9680e8aedb92782a921b13 /files/es/web/api/texttrack
parent4b1a9203c547c019fc5398082ae19a3f3d4c3efe (diff)
downloadtranslated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.gz
translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.bz2
translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.zip
initial commit
Diffstat (limited to 'files/es/web/api/texttrack')
-rw-r--r--files/es/web/api/texttrack/cuechange_event/index.html109
-rw-r--r--files/es/web/api/texttrack/index.html102
2 files changed, 211 insertions, 0 deletions
diff --git a/files/es/web/api/texttrack/cuechange_event/index.html b/files/es/web/api/texttrack/cuechange_event/index.html
new file mode 100644
index 0000000000..4a667535fc
--- /dev/null
+++ b/files/es/web/api/texttrack/cuechange_event/index.html
@@ -0,0 +1,109 @@
+---
+title: 'TextTrack: evento cuechange'
+slug: Web/API/TextTrack/cuechange_event
+tags:
+ - API
+ - Audio
+ - Event
+ - Media
+ - Reference
+ - TextTrack
+ - Video
+ - WebVTT
+ - cuechange
+ - events
+ - oncuechange
+ - track
+translation_of: Web/API/TextTrack/cuechange_event
+---
+<div>{{APIRef}}</div>
+
+<p><span class="seoSummary">El evento <strong><code>cuechange</code></strong> se activa cuando un {{domxref("TextTrack")}} ha cambiado las anotaciones que se estan mostrando.</span> El evento es activado tanto en <code>TextTrack</code> <em>y</em> en el {{domxref("HTMLTrackElement")}} donde esta siendo mostrado, si lo hay.</p>
+
+<table class="properties">
+ <tbody>
+ <tr>
+ <th scope="row">Burbujas</th>
+ <td>No</td>
+ </tr>
+ <tr>
+ <th scope="row">Cancelable</th>
+ <td>No</td>
+ </tr>
+ <tr>
+ <th scope="row">Interfaz</th>
+ <td>{{domxref("Event")}}</td>
+ </tr>
+ <tr>
+ <th scope="row">Propiedad del controlador de eventos</th>
+ <td>{{domxref("GlobalEventHandlers.oncuechange")}}</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="En_el_TextTrack">En el TextTrack</h3>
+
+<p>Tu puedes preparar una escucha para el evento <code>cuechange</code> en un <code>TextTrack</code> usando el método {{domxref("EventTarget.addEventListener", "addEventListener()")}}:</p>
+
+<pre class="brush: js notranslate">track.addEventListener('cuechange', function () {
+ let cues = track.activeCues; // array de las anotaciones actuales
+});
+</pre>
+
+<p>O puedes solo preparar la propiedad del controlador de eventos {{domxref("GlobalEventHandlers.oncuechange", "oncuechange")}}:</p>
+
+<pre class="brush: js notranslate">track.oncuechange = function () {
+ let cues = track.activeCues; // array of current cues
+}</pre>
+
+<h3 id="En_el_elemento_track">En el elemento track</h3>
+
+<p>El subyacente {{domxref("TextTrack")}}, indicado por la propiedad {{domxref("HTMLTrackElement.track", "track")}}, recive un evento  {{domxref("TextTrack.cuechange_event", "cuechange")}} cada vez que la anotación que esta siendo actualmente presentada cambia. Est sucede incluso si la pista de texto no está asociada cun un elemento multimedia.</p>
+
+<p>Si la pista de texto <em>está</em> asociada con el elemento multimedia, usando el elemento {{HTMLElement("track")}} como hijo del elemento {{HTMLElement("audio")}} o del elemento {{HTMLElement("video")}}, el evento <code>cuechange</code> es también enviado al {{domxref("HTMLTrackElement")}}.</p>
+
+<pre class="brush: js notranslate">let textTrackElem = document.getElementById("texttrack");
+
+textTrackElem.addEventListener("cuechange", (event) =&gt; {
+ let cues = event.target.track.activeCues;
+});
+</pre>
+
+<p>Además, puedes utilizar el controlador de eventos <code>oncuechange</code>:</p>
+
+<pre class="brush: js notranslate">let textTrackElem = document.getElementById("texttrack");
+
+textTrackElem.oncuechange = (event) =&gt; {
+ let cues = event.target.track.activeCues;
+});</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Especificación</th>
+ <th scope="col">Estado</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName('HTML WHATWG', '#event-media-cuechange', 'cuechange')}}</td>
+ <td>{{Spec2('HTML WHATWG')}}</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_los_navegadores">Compatibilidad de los navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página está generada desde datos estructurados. Si quieres contribuir a los datos, por favor visita <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una pull request.</div>
+
+<p>{{Compat("api.TextTrack.cuechange_event")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{glossary("WebVTT")}}</li>
+</ul>
diff --git a/files/es/web/api/texttrack/index.html b/files/es/web/api/texttrack/index.html
new file mode 100644
index 0000000000..17c32575fa
--- /dev/null
+++ b/files/es/web/api/texttrack/index.html
@@ -0,0 +1,102 @@
+---
+title: TextTrack
+slug: Web/API/TextTrack
+tags:
+ - API
+ - Interface
+ - Media
+ - NeedsTranslation
+ - Reference
+ - TextTrack
+ - TopicStub
+ - Web
+ - WebVTT
+translation_of: Web/API/TextTrack
+---
+<div>{{APIRef("WebVTT")}}</div>
+
+<div id="interface_description">
+<p>The <code>TextTrack</code> interface—part of the API for handling WebVTT (text tracks on media presentations)—describes and controls the text track associated with a particular {{HTMLElement("track")}} element.</p>
+</div>
+
+<h2 id="Properties">Properties</h2>
+
+<p class="properties also_inherits"><em>This interface also inherits properties from {{domxref("EventTarget")}}.</em></p>
+
+<dl id="property_definitions">
+ <dt>{{domxref("TextTrack.activeCues")}} {{readonlyInline}}</dt>
+ <dd>A {{domxref("TextTrackCueList")}} object listing the currently active set of text track cues. Track cues are active if the current playback position of the media is between the cues' start and end times. Thus, for displayed cues such as captions or subtitles, the active cues are currently being displayed.</dd>
+ <dt>{{domxref("TextTrack.cues")}} {{readonlyInline}}</dt>
+ <dd>A {{domxref("TextTrackCueList")}} which contains all of the track's cues.</dd>
+ <dt>{{domxref("TextTrack.id")}} {{readonlyInline}}</dt>
+ <dd>A {{domxref("DOMString")}} which identifies the track, if it has one. If it doesn't have an ID, then this value is an empty string (<code>""</code>). If the <code>TextTrack</code> is associated with a {{HTMLElement("track")}} element, then the track's ID matches the element's ID.</dd>
+ <dt>{{domxref("TextTrack.inBandMetadataTrackDispatchType")}} {{readonlyInline}}</dt>
+ <dd>Returns a {{domxref("DOMString")}} which indicates the track's in-band metadata track dispatch type. <em><strong>needs details</strong></em></dd>
+ <dt>{{domxref("TextTrack.kind")}} {{readonlyInline}}</dt>
+ <dd>Returns a {{domxref("DOMString")}} indicating what kind of text track the <code>TextTrack</code> describes. The value must be one of those in the TextTrackKind enum.</dd>
+ <dt>{{domxref("TextTrack.label")}} {{readonlyInline}}</dt>
+ <dd>A human-readable {{domxref("DOMString")}} which contains the text track's label, if one is present; otherwise, this is an empty string (<code>""</code>), in which case a custom label may need to be generated by your code using other attributes of the track, if the track's label needs to be exposed to the user.</dd>
+ <dt>{{domxref("TextTrack.language")}} {{readonlyInline}}</dt>
+ <dd>A {{domxref("DOMString")}} which specifies the text language in which the text track's contents is written. The value must adhere to the format specified in the <a href="https://tools.ietf.org/html/bcp47">Tags for Identifying Languages</a> (<a href="https://tools.ietf.org/html/bcp47">BCP 47</a>) document from the IETF, just like the HTML {{htmlattrxref("lang")}} attribute. For example, this can be <code>"en-US"</code> for United States English or <code>"pt-BR"</code> for Brazilian Portuguese.</dd>
+ <dt>{{domxref("TextTrack.mode")}}</dt>
+ <dd>A {{domxref("DOMString")}} specifying the track's current mode. Changing this property's value changes the track's current mode to match. Permitted values are listed under <a href="/en-US/docs/Web/API/TextTrack/mode#Text_track_mode_constants">Text track mode constants</a>. The default is <code>disabled</code>, unless the {{HTMLElement("track")}} element's {{htmlattrxref("default", "track")}} Boolean attribute is specified, in which case the default mode is <code>started</code>.</dd>
+</dl>
+
+<h2 id="Events">Events</h2>
+
+<dl id="event_handler_property_definitions">
+ <dt><code><a href="/en-US/docs/Web/API/TextTrack/cuechange_event">cuechange</a></code></dt>
+ <dd>Fired when cues are entered and exited. A given text cue appears when the cue is entered and disappears when the cue is exited.<br>
+ Also available via the <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/oncuechange">oncuechange</a></code> property.</dd>
+</dl>
+
+<h2 id="methods" name="methods">Methods</h2>
+
+<p class="methods also_inherits"><em>This interface also inherits methods from {{domxref("EventTarget")}}.</em></p>
+
+<dl id="method_definitions">
+ <dt>{{domxref("TextTrack.addCue()")}}</dt>
+ <dd>Adds a cue (specified as a {{domxref("TextTrackCue")}} object to the track's list of cues.</dd>
+ <dt>{{domxref("TextTrack.removeCue()")}}</dt>
+ <dd>Removes a cue (specified as a {{domxref("TextTrackCue")}} object from the track's list of cues.</dd>
+</dl>
+
+<dl id="method_definitions_obsolete">
+</dl>
+
+<h2 id="Example" name="Example">Example</h2>
+
+<p>tbd</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Specification</th>
+ <th scope="col">Status</th>
+ <th scope="col">Comment</th>
+ </tr>
+ <tr>
+ <td>{{ SpecName('HTML WHATWG', '#texttrack', 'TextTrack') }}</td>
+ <td>{{ Spec2('HTML WHATWG') }}</td>
+ <td></td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("api.TextTrack")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/WebVTT_API">WebVTT</a></li>
+ <li>{{domxref("TextTrackCueList")}}</li>
+ <li>{{domxref("VTTCue")}}</li>
+ <li>{{HTMLElement("track")}}</li>
+ <li>{{domxref("HTMLTrackElement")}}</li>
+</ul>