using transform instead of position for moving the videoplayer around2

This commit is contained in:
Kasper Rynning-Tønnesen
2017-04-29 12:33:10 +02:00
parent d503d3a41b
commit 0236493e53
4 changed files with 27 additions and 11 deletions

View File

@@ -325,8 +325,10 @@
}
#player_bottom_overlay{
z-index: 100;
z-index: 999999999999;
cursor: pointer;
top: 0px;
left: 0px;
}
.frontpage_modified_heights{
@@ -336,9 +338,11 @@
.player_bottom{
position: fixed !important;
left: calc(100vw - 270px) !important;
top: calc(100vh - 210px) !important;
transform: translate(calc(100vw - 260px), calc(100vh - 210px)) !important;
/* left: calc(100vw - 270px) !important; */
/* top: calc(100vh - 210px) !important; */
/* bottom: 10px; */
/* top: 0px; */
width: 250px !important;
height: 200px !important;
/* right: 10px; */
@@ -1413,6 +1417,7 @@ ul #chat-log{
#playlist{
/*padding:0px 15px;*/
flex:1;
z-index: 9;
position: relative;
height: calc(100vh - 64px) !important;
/*background-color:rgba(0,0,0,0.2);*/
@@ -1458,7 +1463,12 @@ ul #chat-log{
height:95%;
height: calc(100% - 32px);
position: relative;
-webkit-transition: all 1s ease-out;
transform: translate(0%, 0%);
z-index: 99;
-webkit-transition: transform .5s ease-out;
transition: transform .5s ease-out;
-moz-transition: transform .5s ease-out;
-o-transition: transform .5s ease-out;
}
#fireplace_player{
@@ -1974,6 +1984,12 @@ nav ul li:hover, nav ul li.active {
cursor: ew-resize;
}
#main_components {
position: absolute;
/* top: 96.3%; */
width: calc(100% - .75em);
}
/***************************************************************************
****************************************************************************
********************* Screen size specific rules ***************************

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -627,8 +627,8 @@ function change_offline(enabled, already_offline){
});
$("#controls").on("mousemove", seekToMove);
$("#controls").on("click", seekToClick);
$("body").append("<div id='seekToDuration' class='hide'>00:00/01:00</div>");
$("#seekToDuration").css("top", $("#controls").position().top + 10);
$("#main_components").append("<div id='seekToDuration' class='hide'>00:00/01:00</div>");
$("#seekToDuration").css("top", $("#controls").position().top - 55);
if(!$("#controls").hasClass("ewresize")) $("#controls").addClass("ewresize");
} else {
$("#controls").off("mouseenter");
@@ -1344,7 +1344,7 @@ $(window).resize(function(){
$(".list-song").css("height", List.element_height + "px");
$("#player_overlay").width($("#player").width()+1);
set_title_width();
$("#seekToDuration").css("top", $("#controls").position().top + 10);
if($("#controls").length > 0) $("#seekToDuration").css("top", $("#controls").position().top - 55);
}
})