diff --git a/common/lib/xmodule/xmodule/css/video/display.scss b/common/lib/xmodule/xmodule/css/video/display.scss index 116818fb08..bd478ab0a2 100644 --- a/common/lib/xmodule/xmodule/css/video/display.scss +++ b/common/lib/xmodule/xmodule/css/video/display.scss @@ -744,6 +744,13 @@ } } } + + &.video-fullscreen { + + .closed-captions { + width: 60%; + } + } .subtitles { @include float(left); diff --git a/common/lib/xmodule/xmodule/js/src/video/04_video_full_screen.js b/common/lib/xmodule/xmodule/js/src/video/04_video_full_screen.js index 54c8ae305e..f1ef26f531 100644 --- a/common/lib/xmodule/xmodule/js/src/video/04_video_full_screen.js +++ b/common/lib/xmodule/xmodule/js/src/video/04_video_full_screen.js @@ -133,7 +133,8 @@ define('video/04_video_full_screen.js', [], function () { } function exit() { - var fullScreenClassNameEl = this.el.add(document.documentElement); + var fullScreenClassNameEl = this.el.add(document.documentElement), + closedCaptionsEl = this.el.find('.closed-captions'); this.videoFullScreen.fullScreenState = this.isFullScreen = false; fullScreenClassNameEl.removeClass('video-fullscreen'); @@ -146,10 +147,16 @@ define('video/04_video_full_screen.js', [], function () { .text(gettext('Fill browser')); this.el.trigger('fullscreen', [this.isFullScreen]); + + $(closedCaptionsEl).css({ + 'top': '70%', + 'left': '5%' + }); } function enter() { - var fullScreenClassNameEl = this.el.add(document.documentElement); + var fullScreenClassNameEl = this.el.add(document.documentElement), + closedCaptionsEl = this.el.find('.closed-captions'); this.scrollPos = $(window).scrollTop(); $(window).scrollTop(0); @@ -163,6 +170,11 @@ define('video/04_video_full_screen.js', [], function () { .text(gettext('Exit full browser')); this.el.trigger('fullscreen', [this.isFullScreen]); + + $(closedCaptionsEl).css({ + 'top': '70%', + 'left': '5%' + }); } /** Toggle fullscreen mode. */