web/video.js
1
0
Fork 0
mirror of https://github.com/videojs/video.js.git synced 2025-02-04 11:43:27 +02:00
Code Releases Activity

Hide the volume bar by setting its content's width to zero.

Browse Source
This commit is contained in:
Ryan Plessner 2014-09-25 09:09:44 -04:00
parent 757c592b4a
commit f53583e275
1 changed files with 16 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/css/video-js.less
View File

@ -717,15 +717,18 @@ easily in the skin designer. http://designer.videojs.com/
}
.vjs-default-skin .vjs-menu {
z-index: -1;
display: block;
display: none;
position: absolute;
bottom: 0;
left: 0em; /* (Width of vjs-menu - width of button) / 2 */
width: 0em;
height: 0em;
margin-bottom: 3em;
}
.vjs-default-skin .vjs-menu,
.vjs-default-skin .vjs-volume-menu-button:hover .vjs-menu,
.vjs-default-skin .vjs-volume-menu-button .vjs-menu.vjs-lock-showing {
border-left: 2em solid transparent;
border-right: 2em solid transparent;
@ -733,9 +736,10 @@ easily in the skin designer. http://designer.videojs.com/
border-top-color: rgba(7, 40, 50, 0.5); /* Same as ul background */
}
.vjs-default-skin .vjs-control-content .vjs-menu {
z-index: 0;
display: none;
.vjs-default-skin .vjs-volume-menu-button .vjs-menu {
display: block;
width: 0px;
border: none;
}
/* Button Pop-up Menu */
@ -753,11 +757,14 @@ easily in the skin designer. http://designer.videojs.com/
.background-color-with-alpha(@control-bg-color, @control-bg-alpha);
.box-shadow(-0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2));
}
.vjs-default-skin .vjs-menu-button:hover .vjs-menu,
.vjs-default-skin .vjs-menu-button .vjs-menu.vjs-lock-showing {
z-index: 1;
.vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content {
width: 0px;
}
.vjs-default-skin .vjs-volume-menu-button:hover .vjs-menu .vjs-menu-content,
.vjs-default-skin .vjs-volume-menu-button .vjs-menu.vjs-lock-showing .vjs-menu-content {
width: 10em;
}
.vjs-default-skin .vjs-menu-button:hover .vjs-control-content .vjs-menu,
.vjs-default-skin .vjs-control-content .vjs-menu.vjs-lock-showing {
display: block;
}