Formatting of Closed Captions in Lectora Online

ewalsh-3688

Hi All,

Could really do with some help around the formatting of Closed Captions in Lectora Online. I've inserted several MP4 video files into a title, and also added VTT closed caption files for each. However when the title is previewed or published the captions are shown in white text with a transparent background making them unreadable against the lighter parts of the video.

I added some CSS code to the top of each VTT file (shown below) but the background is partially transparent and I can't seem to add line spacing or set the caption background to be completely black rather than transparent.

I'm surprised there isn't a way to set the default look and feel of closed captions - is anyone able to suggest anything? Unfortunately I'm awful at CSS
Thanks in advance,

STYLE
::cue {​​​​​​
background: black;
color: white;
}​​​​​​

Christie Calahan

It looks like you may have stumped the community! I am sure our customer solutions team can help, please submit a ticket to them here:

https://knowledgebase.elearningbrothers.com/submit-a-case-to-customer-solutions

jholland

@ewalsh-3688, here's a way to modify the background of the caption. You can add this at the title level to inherit on every page, or place on individual pages and modify the color based on that page's video colors.

Create an action to run "On Show" -> "Run Javascript". Then place this code in the javascript box:

triv$( '.mejs__captions-text', getDisplayDocument() ).css("background-color","black");

You can change the "black" to any valid CSS color.

ewalsh-3688

@jholland that works perfectly, thank you