add close button to me.js controls for auto show/hidemediaelement

2 files changed, 4 insertions, 11 deletions

diff --git a/css/style.css b/css/style.css
index 1315cbd..0640c16 100755
--- a/css/style.css
+++ b/css/style.css
@@ -39,20 +39,13 @@
 	right: 10px;
 	width: 30px;
 	height: 30px;
-	opacity: .35;
+	opacity: .35 !important;
 	cursor: pointer;
 	z-index: 2;
 }
 
 #box-close:hover {
-	opacity: .75;
-}
-
-.vjs-sublime-skin.vjs-has-started.vjs-user-inactive.vjs-playing #box-close {
-	opacity: 0;
-	-webkit-transition: opacity 1s cubic-bezier(.455,.03,.515,.955);
-	-moz-transition: opacity 1s cubic-bezier(.455,.03,.515,.955);
-	transition: opacity 1s cubic-bezier(.455,.03,.515,.955);
+	opacity: .75 !important;
 }
 
 #videoplayer button {
diff --git a/js/viewer.js b/js/viewer.js
index 9545d0d..56949d5 100755
--- a/js/viewer.js
+++ b/js/viewer.js
@@ -46,8 +46,8 @@ var videoViewer = {
 				success: function(mediaElement, domElement, player) {
 					videoViewer.player = mediaElement;
 					// append close button to video element
-					var closeButton = $('<a class="icon-view-close" id="box-close" href="#"></a>').click(videoViewer.hidePlayer);
-					$('#videoplayer').append(closeButton);
+					var closeButton = $('<a class="icon-view-close mejs__control" id="box-close" href="#"></a>').click(videoViewer.hidePlayer);
+					$(".mejs__video").append(closeButton);
 					// autoplay
 					videoViewer.player.play();
 					// focus the player to make keyboard shortcuts work