西瓜播放器 HTML5 video video.js 播放器 HTML5播放器 mp4 hls hls.js flv flv.js dash dash.js 无缝切换

texttrack

Subtitle display plugin SourceCode

pluginName: texttrack

Function description:

  1. Show the list of subtitles
  2. Load and parse the subtitle content, and display it as a dom structure

config

position

  • @type: String
  • default: POSITIONS.ROOT_RIGHTFor specific enumeration values, please see plugin-positions

index

  • @type: Number
  • default: 6

list

  • @type: Arrays Subtitle list
  • default: []

The data structure is as follows

list = [{
  id: String | Number,  // Used to identify the uniqueness of subtitles
  language: String,     // Language 
  text: String | {[propName: String]: Any},     // Text displayed in the toggle list
  isDefault:  Boolean,   // Is it the default subtitle
  url: String // Subtitle loading url
}]

isDefaultOpen

  • @type: Boolean
  • default: false

Is it on by default

style

  • @type: Object, The data structure is as follows
  • default: 如下所示
style: {
  follow: true, // Whether to follow the control bar to adjust the position
  mode: 'stroke', // Font display mode, the default is stroke
  followBottom: 50, // Follow the height of the bottom control bar
  fitVideo: true, // Whether to automatically adjust the font size following the video
  offsetBottom: 2, // Vertical video adaptation reference font size
  baseSizeX: 49, // Standard font size for horizontal video adaptation
  baseSizeY: 28, // Vertical video adaptation reference font size
  minSize: 16, // The mini font size on pc
  minMobileSize: 13, // The mini font size on mobile
  line: 'double', // Maximum number of display lines, single/double/three
  fontColor: '#fff' //Font color
}

closeText

  • @type: { { text: string, iconText: string } }
  • default: { text: '不开启', iconText: '字幕' }

API

updateSubtitles(list)

  • @desc: Update subtitle list
  • @param: { Arrays } list data structure referenceconfig.list