Как скрыть/отключить элементы управления кнопками в videojs? ⇐ Javascript
Как скрыть/отключить элементы управления кнопками в videojs?
У меня есть приложение с video.js и vue.
Я пытаюсь найти способ скрыть или отключить эти элементы управления: кнопку воспроизведения, скорость воспроизведения и сделать индикатор выполнения доступным только для чтения.
В документации video.js есть controls: false, который скрывает всю панель элементов управления. и это не то, чего я хочу.
Я также пытаюсь разобраться в машинописном тексте DefinitelyTyped, в опциях controlBar есть только два свойства: VolumePanel и FullscreenToggle. ничего об игре, индикаторе прогресса или скорости.
Изменить Я нашел controlBar: { playToggle: false , который скрывает кнопку воспроизведения.
Но я все же нашел способ сделать индикатор прогресса доступным только для чтения/отключить.
Есть идеи, как это сделать?
Мой код выглядит так:
Vue.use(VueVideoPlayer) новый Vue({ эль: '#vueapp', данные() { возвращаться { сообщение: «Привет от Vue», // параметры видеоjs Параметры игрока: { высота: '360', автозапуск: правда, приглушено: правда, язык: 'en', Скорость воспроизведения: [0,7, 1,0, 1,5, 2,0], источники: [{ тип: "видео/mp4", // mp4 источник: "http://vjs.zencdn.net/v/oceans.mp4", // вебм // источник: "https://cdn.theguardian.tv/webM/2015/07/20/150716 YesMen_synd_768k_vp8.webm" }], плакат: "https://surmon-china.github.io/vue-quil ... rmon-1.jpg", } } }, смонтирован() { // console.log('это текущий объект экземпляра проигрывателя', this.player) setTimeout(() => { console.log('Параметры динамического изменения', this.player) this.player.muted (ложь) }, 2000) }, вычислено: { игрок() { верните это.$refs.videoPlayer.player } }, методы: { // событие прослушивания onPlayerPlay (игрок) { // console.log('игрок играет!', player) }, onPlayerPause (игрок) { // console.log('плеер пауза!', player) }, onPlayerEnded (игрок) { // console.log('плеер закончился!', player) }, onPlayerLoadeddata (игрок) { // console.log('player Loadeddata!', player) }, onPlayerWaiting (игрок) { // console.log('игрок ждет!', player) }, onPlayerPlaying (игрок) { // console.log('игрок играет!', player) }, onPlayerTimeupdate (игрок) { // console.log('player Timeupdate!', player.currentTime()) }, onPlayerCanplay (игрок) { // console.log('игрок может играть!', player) }, onPlayerCanplaythrough (игрок) { // console.log('игрок может пройти игру!', player) }, // или событие состояния прослушивания playerStateChanged (playerCurrentState) { // console.log('текущее состояние обновления игрока', playerCurrentState) }, // игрок готов playerReadied(игрок) { // ищем 10 секунд console.log('Пример игрока 1 готов', player) player.currentTime(10) // console.log('пример 01: плеер готов', player) } } }) {{сообщение}}
У меня есть приложение с video.js и vue.
Я пытаюсь найти способ скрыть или отключить эти элементы управления: кнопку воспроизведения, скорость воспроизведения и сделать индикатор выполнения доступным только для чтения.
В документации video.js есть controls: false, который скрывает всю панель элементов управления. и это не то, чего я хочу.
Я также пытаюсь разобраться в машинописном тексте DefinitelyTyped, в опциях controlBar есть только два свойства: VolumePanel и FullscreenToggle. ничего об игре, индикаторе прогресса или скорости.
Изменить Я нашел controlBar: { playToggle: false , который скрывает кнопку воспроизведения.
Но я все же нашел способ сделать индикатор прогресса доступным только для чтения/отключить.
Есть идеи, как это сделать?
Мой код выглядит так:
Vue.use(VueVideoPlayer) новый Vue({ эль: '#vueapp', данные() { возвращаться { сообщение: «Привет от Vue», // параметры видеоjs Параметры игрока: { высота: '360', автозапуск: правда, приглушено: правда, язык: 'en', Скорость воспроизведения: [0,7, 1,0, 1,5, 2,0], источники: [{ тип: "видео/mp4", // mp4 источник: "http://vjs.zencdn.net/v/oceans.mp4", // вебм // источник: "https://cdn.theguardian.tv/webM/2015/07/20/150716 YesMen_synd_768k_vp8.webm" }], плакат: "https://surmon-china.github.io/vue-quil ... rmon-1.jpg", } } }, смонтирован() { // console.log('это текущий объект экземпляра проигрывателя', this.player) setTimeout(() => { console.log('Параметры динамического изменения', this.player) this.player.muted (ложь) }, 2000) }, вычислено: { игрок() { верните это.$refs.videoPlayer.player } }, методы: { // событие прослушивания onPlayerPlay (игрок) { // console.log('игрок играет!', player) }, onPlayerPause (игрок) { // console.log('плеер пауза!', player) }, onPlayerEnded (игрок) { // console.log('плеер закончился!', player) }, onPlayerLoadeddata (игрок) { // console.log('player Loadeddata!', player) }, onPlayerWaiting (игрок) { // console.log('игрок ждет!', player) }, onPlayerPlaying (игрок) { // console.log('игрок играет!', player) }, onPlayerTimeupdate (игрок) { // console.log('player Timeupdate!', player.currentTime()) }, onPlayerCanplay (игрок) { // console.log('игрок может играть!', player) }, onPlayerCanplaythrough (игрок) { // console.log('игрок может пройти игру!', player) }, // или событие состояния прослушивания playerStateChanged (playerCurrentState) { // console.log('текущее состояние обновления игрока', playerCurrentState) }, // игрок готов playerReadied(игрок) { // ищем 10 секунд console.log('Пример игрока 1 готов', player) player.currentTime(10) // console.log('пример 01: плеер готов', player) } } }) {{сообщение}}
-
- Похожие темы
- Ответы
- Просмотры
- Последнее сообщение
-
-
Videojs – Как уловить пользовательские коды ошибок HTTP во время прямой трансляции?
Anonymous » » в форуме Jquery - 0 Ответы
- 19 Просмотры
-
Последнее сообщение Anonymous
-