Show mouse display on hover

This commit is contained in:
Omar Roth 2019-05-03 08:51:27 -05:00
parent d2c40e9a0d
commit 0afc4f07c0
No known key found for this signature in database
GPG key ID: B8254FB7EC3D37F2
2 changed files with 5 additions and 5 deletions

View file

@ -164,15 +164,15 @@ class vttThumbnailsPlugin {
}
setupThumbnailElement (data) {
const mouseDisplay = this.player.$('.vjs-mouse-display')
this.progressBar = this.player.$('.vjs-progress-control')
const thumbHolder = document.createElement('div')
thumbHolder.setAttribute('class', 'vjs-vtt-thumbnail-display')
this.progressBar.appendChild(thumbHolder)
this.thumbnailHolder = thumbHolder
if(mouseDisplay) {
mouseDisplay.classList.add('vjs-hidden')
}
// const mouseDisplay = this.player.$('.vjs-mouse-display');
// if(mouseDisplay) {
// mouseDisplay.classList.add('vjs-hidden')
// }
this.registeredEvents.progressBarMouseEnter = () => { return this.onBarMouseenter() };
this.registeredEvents.progressBarMouseLeave = () => { return this.onBarMouseleave() };
this.progressBar.addEventListener('mouseenter', this.registeredEvents.progressBarMouseEnter)

View file

@ -9,7 +9,7 @@
.vjs-vtt-thumbnail-display {
position: absolute;
transition: transform .1s, opacity .2s;
// transition: transform .1s, opacity .2s;
bottom: 85%;
pointer-events: none;
box-shadow: 0 0 7px rgba(0,0,0,.6);