DEVHIDE
  • Home (current)
  • About
  • Contact
  • Cookie
  • Home (current)
  • About
  • Contact
  • Cookie
  • Disclaimer
  • Privacy
  • TOS
Login Or Sign up

TTML caption file not working in all browsers

1.3k Views Asked by Arvin At 21 April 2015 at 09:01 2025-12-21T11:47:29.302000

I am integrating closed captions in my video element

 <div style="text-align:center;">
        <video width="720" height="360" controls>
            <source src="Files/testvideo_1.mp4" type="video/mp4">
            <track label="English" kind="subtitles" srclang="en" src="Files/testvideo_CC.xml" default >
            Your browser does not support the video tag.
        </video>
    </div>

The caption file used here is of ttml type.According to this link below both ttml and webvtt type caption files will work on html5 video.

http://www.html5labs.com/prototypes/video-captioning/video-captioning/info

But in internet explorer ttml format is working and webvtt is not. In the case of firefox and chrome only webvtt file is working and ttml is not.See the link below

http://www.html5labs.com/prototypes/video-captioning/video-captioning/info

I have only ttml type caption files with me and in most of the tutorials in web they are using webvtt files, so is there any way to use this in all browsers

html5-video closed-captions webvtt ttml
Original Q&A
2

There are 2 best solutions below

0
TimHayes TimHayes On 21 April 2015 at 15:32

TTML and WebVTT were competing standards for captioning a few years ago when the spec was emerging, but since then WebVTT has largely won out. You shouldn't need to use TTML.

Check the HTML5 track spec discussing the use of WebVTT and the caniuse for WebVTT. Neither lists TTML as an alternative.

0
Nigel Megitt Nigel Megitt On 22 April 2015 at 15:28

Both TTML and WebVTT are standardised by the W3C's Timed Text Working Group (TTWG), whose charter lists both. To get to Recommendation they both have to be Web friendly. TTML has been a recommendation since 2010, WebVTT is on the track, currently at first public working draft.

Today, more browsers support WebVTT to some extent out of the box; although IE has historically supported TTML natively, typical implementations such as the BBC's iPlayer use Javascript to parse the TTML and present it. That approach is also workable for WebVTT. By the way, Google Chromecast also plays TTML natively, and there's some code in Exoplayer for playing back TTML on Android. There are lots of other examples of player code on github for example.

TTML (or profiles of TTML) is also widely used in implementations not primarily seen as browsers for example in connected TV specifications like YouView, CFF, HbbTV, DVB DASH, ARIB etc.

Related Questions in HTML5-VIDEO

  • Video tags play audio but not video
  • Does video tag html5 slow my webpage or is it heavy if I have many videos in video tags?
  • How can I use javascript to get the thumbnail of an html5 video?
  • Want to hide scrollbar when a absolute div already has a 100% height
  • Html5 videos not displaying
  • If section has class than start playing video
  • Load Html5Video 100% then show Page
  • html crops height video to height 100vh, video to fullscreen
  • Fully preload html5 video from CDN in Safari
  • How to create a Javascript video overlay with VAST VPAID?
  • Getting video metadata from a Youtube video
  • How to add video background over a section?
  • Ignore HTML5 on mobile devices
  • video, form then video in html
  • Add a preload image that disappears after video is loaded

Related Questions in CLOSED-CAPTIONS

  • Adding subtitles to AVPlayer video
  • Is it possible to move an HTML5 video CC under the video?
  • How can I get live transcription on OS X (without audio files)?
  • Kaltura captions: set default language to None or otherwise force them off?
  • Turning off closed caption on HTML5 video by default
  • youtube as3 api closed captioning error
  • ios 14 and macOS safari 14 broke captions using video.js
  • Schema/DTD for Youtube json3 transcript format
  • When the update occurs on Android TV, canvas seems to expand
  • How to enable closed captions by default with OpenPlayerJS / video.js?
  • How do I encode WebVTT document as UTF-8 and MIME type="text/vtt"?
  • How to punctuate youtube transcripts?
  • React Native Expo Audio API - Sync UI Elements
  • AWS Service for converting closed caption files
  • Any way to turn on/off live captions on Chrome programmatically?

Related Questions in WEBVTT

  • HTML5 track cues empty
  • Is it possible for podcast audio stream to have script/text?
  • Is it possible to move an HTML5 video CC under the video?
  • Using Javascript to convert .srt to .webvtt
  • Does HTML5 Video support srt textTrack?
  • Is it possible for HTML5 video to play subtitles embedded in mp4 file as a track?
  • How do I color cues on webvtt?
  • Node JS Promise.all to async update properties in array of JSON objects
  • track element in html5 video player
  • Dash JS player x Cloudflare displaying adaptation ID for CC options
  • WebVTT to JSON using `jq`
  • How to fix unsafe attempt error and show the caption?
  • FFMPEG multiple styles in .srt file
  • Styling VTT cues - ::cue(#id) selector does not work
  • Giving VTT subtitles a fading out effect

Related Questions in TTML

  • HTML5 video + TTML subtitle is not displaying subtitle
  • How do I add an arbitrary namespace to an XslCompiledTransform at run-time?
  • What happens if different region attribute values are specified on parent and child?
  • Remove xml node from ttml file C#
  • How to convert .srt file into ttml based xml subtitle file using ffmpeg?
  • CAF Receiver: Positioning of subtitles
  • How to browse thru TTML and get all the time\captions into JSON file
  • Python parsing weird root - TTML (XML) with ElementTree or lxml
  • Use AS3 to parse XML node attribute that has a colon
  • Adding some kind of subtitle to an mp4 with ffmpeg
  • YouTube Data API V3: Download caption
  • Sprite Image reference using TTML
  • CAF: subtitles positioning issue even after shaka-player update
  • how to setup MPEG-DASH in mac?
  • ChromeCast TTML Closed Captioning with Smooth Streaming and PlayReady

Trending Questions

  • UIImageView Frame Doesn't Reflect Constraints
  • Is it possible to use adb commands to click on a view by finding its ID?
  • How to create a new web character symbol recognizable by html/javascript?
  • Why isn't my CSS3 animation smooth in Google Chrome (but very smooth on other browsers)?
  • Heap Gives Page Fault
  • Connect ffmpeg to Visual Studio 2008
  • Both Object- and ValueAnimator jumps when Duration is set above API LvL 24
  • How to avoid default initialization of objects in std::vector?
  • second argument of the command line arguments in a format other than char** argv or char* argv[]
  • How to improve efficiency of algorithm which generates next lexicographic permutation?
  • Navigating to the another actvity app getting crash in android
  • How to read the particular message format in android and store in sqlite database?
  • Resetting inventory status after order is cancelled
  • Efficiently compute powers of X in SSE/AVX
  • Insert into an external database using ajax and php : POST 500 (Internal Server Error)

Popular # Hahtags

javascript python java c# php android html jquery c++ css ios sql mysql r reactjs

Popular Questions

  • How do I undo the most recent local commits in Git?
  • How can I remove a specific item from an array in JavaScript?
  • How do I delete a Git branch locally and remotely?
  • Find all files containing a specific text (string) on Linux?
  • How do I revert a Git repository to a previous commit?
  • How do I create an HTML button that acts like a link?
  • How do I check out a remote Git branch?
  • How do I force "git pull" to overwrite local files?
  • How do I list all files of a directory?
  • How to check whether a string contains a substring in JavaScript?
  • How do I redirect to another webpage?
  • How can I iterate over rows in a Pandas DataFrame?
  • How do I convert a String to an int in Java?
  • Does Python have a string 'contains' substring method?
  • How do I check if a string contains a specific word?
.

Copyright © 2021 Jogjafile Inc.

  • Disclaimer
  • Privacy
  • TOS
  • Homegardensmart
  • Math
  • Aftereffectstemplates