Search completed in 2.55 seconds.
Web Video Text Tracks Format (WebVTT) - Web APIs
a webvtt file (.vtt) contains
cues, which can be either a single line or multiple lines, as shown below: webvtt 00:01.000 --> 00:04.000 - never drink liquid nitrogen.
... zero or more
cues or comments.
... example 1 - simplest possible webvtt file webvtt example 2 - very simple webvtt file with a text header webvtt - this file has no
cues.
...And 12 more matches
TextTrack.mode - Web APIs
safari additionally requires the default boolean attribute to be set to true when implementing your own video player controls in order for the subtitles
cues to be shown.
...no
cues are active, no events are being fired, and the user agent won't attempt to obtain the track's
cues.
... hidden the text track is currently active but the
cues aren't being displayed.
...And 10 more matches
TextTrack - Web APIs
texttrack.active
cues read only a 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.
...And 4 more matches
HTMLTrackElement - Web APIs
htmltrackelement.readystate read only returns an unsigned short that show the readiness state of the track: constant value description none 0 indicates that the text track's
cues have not been obtained.
...further
cues might still be added to the track by the parser.
...some or all of the
cues are likely missing and will not be obtained.
...And 2 more matches
::cue - CSS: Cascading Style Sheets
the ::cue css pseudo-element matches webvtt
cues within a selected element.
... this can be used to style captions and other
cues in media with vtt tracks.
... ::cue { color: yellow; font-weight: bold; } the properties are applied to the entire set of
cues as if they were a single unit.
...t background-size color font font-family font-size font-stretch font-style font-variant font-weight line-height opacity outline outline-color outline-style outline-width ruby-position text-combine-upright text-decoration text-decoration-color text-decoration-line text-decoration-style text-decoration-thickness text-shadow visibility white-space examples styling webvtt
cues as white-on-black the following css sets the cue style so that the text is white and the background is a translucent black box.
Video and audio content - Learn web development
these text strings are called
cues, and there are several kinds of
cues which are used for different purposes.
... the most common
cues are: subtitles translations of foreign material, for people who don't understand the words spoken in the audio.
...use the kind attribute to specify whether the
cues are subtitles, captions, or descriptions.
HTMLTrackElement: cuechange event - Web APIs
the cuechange event fires when a texttrack has changed the currently displaying
cues.
... bubbles no cancelable no interface event event handler oncuechange examples on the texttrack you can set up a listener for the cuechange event on a texttrack using the addeventlistener() method: track.addeventlistener('cuechange', function () { let
cues = track.active
cues; // array of current
cues }); or you can just set the oncuechange event handler property: track.oncuechange = function () { let
cues = track.active
cues; // array of current
cues } on the track element the underlying texttrack, indicated by the track property, receives a cuechange event every time the currently-presented cue is changed.
... let texttrackelem = document.getelementbyid("texttrack"); texttrackelem.addeventlistener("cuechange", (event) => { let
cues = event.target.track.active
cues; }); in addition, you can use the oncuechange event handler: let texttrackelem = document.getelementbyid("texttrack"); texttrackelem.oncuechange = (event) => { let
cues = event.target.track.active
cues; }); specifications specification status html living standardthe definition of 'cuechange' in that specification.
TextTrack: cuechange event - Web APIs
the cuechange event fires when a texttrack has changed the currently displaying
cues.
... bubbles no cancelable no interface event event handler property globaleventhandlers.oncuechange examples on the texttrack you can set up a listener for the cuechange event on a texttrack using the addeventlistener() method: track.addeventlistener('cuechange', function () { let
cues = track.active
cues; // array of current
cues }); or you can just set the oncuechange event handler property: track.oncuechange = function () { let
cues = track.active
cues; // array of current
cues } on the track element the underlying texttrack, indicated by the track property, receives a cuechange event every time the currently-presented cue is changed.
... let texttrackelem = document.getelementbyid("texttrack"); texttrackelem.addeventlistener("cuechange", (event) => { let
cues = event.target.track.active
cues; }); in addition, you can use the oncuechange event handler: let texttrackelem = document.getelementbyid("texttrack"); texttrackelem.oncuechange = (event) => { let
cues = event.target.track.active
cues; }); specifications specification status html living standardthe definition of 'cuechange' in that specification.
::cue-region - CSS: Cascading Style Sheets
the ::cue-region css pseudo-element matches webvtt
cues within a selected element.
... this can be used to style captions and other
cues in media with vtt tracks.
... ::cue-region { color: yellow; font-weight: bold; } the properties are applied to the entire set of
cues as if they were a single unit.
Adding captions and subtitles to HTML5 video - Developer guides
} .subtitles-menu li { padding:0; text-align:center; } .subtitles-menu li button { border:none; background:#000; color:#fff; cursor:pointer; width:90%; padding:2px 5px; border-radius:2px; } styling the displayed subtitles one of the less well known about and supported features of webvtt is the ability to style the individual subtitles (something called text
cues) via css extensions.
... the ::cue pseudo-element is the key to targetting individual text track
cues for styling, as it matches any defined cue.
... there are only a handful of css properties that can be applied to a text cue: color opacity visibility text-decoration text-shadow background shorthand properties outline shorthand properties font shorthand properties, including line-height white-space for example, to change the text colour of the text track
cues you can write: ::cue { color:#ccc; } if the webvtt file uses voice spans, which allow
cues to be defined as having a particular "voice": 0 00:00:00.000 --> 00:00:12.000 <v test>[test]</v> then this specific 'voice' will be stylable like so: ::cue(v[voice='test']) { color:#fff; background:#0095dd; } note: some of the styling of
cues with ::cue currently works on chrome, opera, and safari, but not yet on firefox.
Index - Web APIs
1947 htmltrackelement: cuechange event api, accessibility, audio, chapters, descriptions, htmltexttrack, media, reference, text, texttrack, video, webvtt, a11y, captions, cuechange, events, oncuechange, track, vtt the cuechange event fires when a texttrack has changed the currently displaying
cues.
... 4244 texttrack: cuechange event api, event, reference, texttrack, webvtt, cuechange, oncuechange, track the cuechange event fires when a texttrack has changed the currently displaying
cues.
<track>: The Embed Text Track element - HTML: Hypertext Markup Language
it may include important non-verbal information such as music
cues or sound effects.
... let texttrackelem = document.getelementbyid("texttrack"); texttrackelem.addeventlistener("cuechange", (event) => { let
cues = event.target.track.active
cues; }); in addition, you can use the oncuechange event handler: let texttrackelem = document.getelementbyid("texttrack"); texttrackelem.oncuechange = (event) => { let
cues = event.target.track.active
cues; }); examples <video controls poster="/images/sample.gif"> <source src="sample.mp4" type="video/mp4"> <source src="sample.ogv" type="video/ogv"> <tra...
Mozilla's Section 508 Compliance
(l) when electronic forms are used, the form shall allow people using assistive technology to access the information, field elements, and functionality required for completion and submission of the form, including all directions and
cues.
Accessible Toolkit Checklist
this can be supported through spi_getkeyboard
cues and spi_getmenuunderlines simple widgets buttons tab, arrow, unmodified letter mnemonics require and support text labels for buttons with images, can be same as tooltip space key activates button enter key activates focused button (thus current button, not default button shows dark border when a different button is focused) when button has a popup av...
AudioContextLatencyCategory - Web APIs
"interactive" the audio is involved in interactive elements, such as responding to user actions or needing to coincide with visual
cues such as a video or game action.
AudioContextOptions - Web APIs
"interactive" the audio is involved in interactive elements, such as responding to user actions or needing to coincide with visual
cues such as a video or game action.
Request.destination - Web APIs
this type is much broader than the usual document type values (such as "document" or "manifest"), and may include contextual
cues such as "image" or "worker" or "audioworklet".
TextTrackCue - Web APIs
these
cues represent a string of text that is presented for some duration of time during the performance of a texttrack.
VTTRegion - Web APIs
vttregion.scroll an enum representing how adding new
cues will move existing
cues.
Fundamentals of WebXR - Web APIs
unless they're in a safe environment, it's important to provide
cues to restrict their movement, such as by simulating a space that is known to be safe within their physical environment.
ARIA: button role - Accessibility
the included css style is provided to make the <span> element look like a button, and to provide visual
cues when the button has focus.
Understandable - Accessibility
3.3.5 context-sensitive help is available (aaa) provide instructions and other appropriate
cues in context to aid form completion and submission.
@counter-style - CSS: Cascading Style Sheets
for example, the value of the marker symbol can be read out as numbers or alphabets for ordered lists or as audio
cues for unordered lists, based on the value of this descriptor.
HTML documentation index - HTML: Hypertext Markup Language
213 <track>: the embed text track element accessibility,
cues, element, html, html embedded content, html5, multimedia, reference, texttrack, web, a11y, track the html <track> element is used as a child of the media elements, <audio> and <video>.