diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/js/plyr.js | 8 | ||||
-rw-r--r-- | src/less/plyr.less | 47 |
2 files changed, 30 insertions, 25 deletions
diff --git a/src/js/plyr.js b/src/js/plyr.js index 6bcf38c5..daee06e6 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -1431,12 +1431,16 @@ // Play media function _play() { - plyr.media.play(); + if('play' in plyr.media) { + plyr.media.play(); + } } // Pause media function _pause() { - plyr.media.pause(); + if('pause' in plyr.media) { + plyr.media.pause(); + } } // Toggle playback diff --git a/src/less/plyr.less b/src/less/plyr.less index f0222e67..1cadd0ab 100644 --- a/src/less/plyr.less +++ b/src/less/plyr.less @@ -624,41 +624,42 @@ video { height: 100%; } - .plyr-video-wrapper { + .plyr__video-wrapper { height: 100%; width: 100%; } - .plyr-controls { + .plyr__controls { position: absolute; bottom: 0; left: 0; right: 0; } + } - // Hide controls when playing in full screen - &--fullscreen--hide-controls.plyr--playing { - .plyr__controls { - transform: translateY(100%) translateY(@control-spacing / 2); - transition: transform .3s .2s ease; - } - &.plyr--hover .plyr__controls { - transform: translateY(0); - } - .plyr__captions { - bottom: (@control-spacing / 2); - transition: bottom .3s .2s ease; - } + // Hide controls when playing in full screen + &--fullscreen--hide-controls.plyr--playing { + .plyr__controls { + transform: translateY(100%) translateY(@control-spacing / 2); + transition: transform .3s .2s ease; + } + &.plyr--hover .plyr__controls { + transform: translateY(0); + } + .plyr__captions { + bottom: (@control-spacing / 2); + transition: bottom .3s .2s ease; } + } - // Captions - .plyr__captions, - &--fullscreen--hide-controls.plyr--playing.plyr--hover .plyr__captions { - top: auto; - bottom: 90px; + // Captions + &--fullscreen .plyr__captions, + &--fullscreen-active .plyr__captions, + &--fullscreen--hide-controls.plyr--playing.plyr--hover .plyr__captions { + top: auto; + bottom: 90px; - @media (min-width: @bp-control-split) { - bottom: 60px; - } + @media (min-width: @bp-control-split) { + bottom: 60px; } } |