Questions tagged [webvtt]

WebVTT (Web Video Text Tracks) is a plain-text subtitle format designed for use with HTML5 video.

WebVTT (Web Video Text Tracks) is a plain-text subtitle format designed for use with HTML5 video. It was developed by the W3C and WHATWG and widely based on the SubRip file format.

References

183 questions
0
votes
1 answer

Styling VTT cues - ::cue(#id) selector does not work

I'm trying to style dynamically added VTT cues by trying to target the cue id: track = video.addTextTrack('captions', 'Captions', 'en'); track.mode = 'showing'; const cue = new VTTCue(0, 10, "Hello world"); cue.id =…
Cesare Polonara
  • 3,473
  • 1
  • 9
  • 19
0
votes
1 answer

Giving VTT subtitles a fading out effect

I'm currently trying to implement or test a new feature on my locally hosted page which plays video with subtitles on. The subtitle format being VTT. I've been trying to find how to actually be able to edit the VTT itself as I am trying to give a…
Spike
  • 1
  • 1
0
votes
1 answer

Is there a way to autogenerate a caption file in html using the Speech Recognition API?

Say I'm creating a youtube-type application, and want to create auto-generated captions. I have the video .mp4 file, and I want to generate a .vtt file for that. Is there anyway to do that with just the SpeechRecognition API and VTTCues? Like…
0
votes
1 answer

Positioning all subtitles of a vtt file over video rather than positioning cue by cue

I want all .vtt subtitles to be lifted upwards over my htmlVideoElement a bit because they are too low down in the video viewport. I've read loads of articles and they all use the same example which doesn't solve my problem. I can position…
Not My Problem
  • 17
  • 1
  • 1
  • 5
0
votes
0 answers

Go to previous cue in a texttrack element when current track id is empty

I'm trying to implement a way to navigate through the subtitles of a video that has subtitles in WebVTT format. Task: I would like to click on a button to make the video go to the beginning of the previous cue, but sometimes the video is between two…
0
votes
0 answers

When using webvtt in html file, is it possible to change all lines with javascript?

I recently created html files with video and webvtt subtitles. Everything is fine, but when I watch the video on mobile, the position of the subtitles is too low. After searching I found that to fix this I had to add line:XX% to each line of the vtt…
JS KIM
  • 695
  • 1
  • 5
  • 12
0
votes
1 answer

Positioning WebVTT text overlay (subtitles) in four corners of the video

I have a problem with positioning WebVTT subtitles. I'd like to have 4 placeholders in four corners of the video to post some additional data along with the video. The problem is, the positioning acts weird and I guess it's kinda hackish way to do…
Mark
  • 1,357
  • 16
  • 30
0
votes
1 answer

Javascript transform a WEBTT file into a json

File .vtt: WEBVTT 00:00:00.039 --> 00:00:25.968 VINCENZO Cassano! 00:00:26.044 --> 00:00:26.961 Damn it. 00:01:23.434 --> 00:01:24.894 Mr. Vincenzo Cassano. 00:01:24.978 --> 00:01:27.814 You're under arrest for the murder of Mr. Oh…
Paul
  • 3,644
  • 9
  • 47
  • 113
0
votes
0 answers

WebVTT: Escape & in subtitle for Firefox 87.0

I'd like to generate Web VTT subtitle files for a video about HTML. But I can't figure out how to show the string & in Firefox. This works fine in Chromium 89.0 (it shows &): 00:00.000 --> 00:02.000 & But Firefox 87.0 shows just &.
S. Doe
  • 685
  • 1
  • 6
  • 25
0
votes
0 answers

WebVTT: Escape NOTE in subtitle for Firefox 87.0

In an application I generate Web VTT video subtitle files using input from users and other data sources. Generally this works fine, but I can't figure out how to show a subtitle line in Firefox starting with the string "NOTE". Example: 00:00.000 -->…
S. Doe
  • 685
  • 1
  • 6
  • 25
0
votes
1 answer

what does xywh mean in vtt file

what do these lines: #xywh=0,0,160,90 means in vtt file for thumbnails ? WEBVTT 00:00.000 --> 00:05.000 /assets/thumbnails.jpg#xywh=0,0,160,90 00:05.000 --> 00:10.000 /assets/preview2.jpg#xywh=160,0,320,90 00:10.000 -->…
Jeremy
  • 79
  • 1
  • 6
0
votes
1 answer

FFMPEG multiple styles in .srt file

I have an SRT file and want to change the background color and level of transparency for individual tracks. Is this possible, or would I have to adopt a more advanced format? Would this task even work in FFMPEG? 1 0:0:1,440 --> 0:0:1,970 …
Tim
  • 170
  • 10
0
votes
1 answer

Node JS Promise.all to async update properties in array of JSON objects

I'm new to JS and Node.js and I'm working on a personnal project to translate webVTT subtitle files using Azure Translator API - To do that, I use the node-webvtt npm package to parse / compile the webVTT file. The parsing operation provides a JSON…
timoleo23
  • 11
  • 2
0
votes
1 answer

FFMPEG Webvtt m3u8 download into single vtt file, ignore the "X-TIMESTAMP-MAP=MPEGTS=" (timestamp sync problem)

I want to download the subtitle of a video, it has separated m3u8 file for subtitle: webvtt source in m3u8 format:…
Panda Xia
  • 3
  • 1
  • 2
0
votes
1 answer

WebVTT captions not showing

I'm adding captions to a video I recorded, however none of the captions that I created in my captions.vtt file aren't showing. What is wrong with my code? websites.html