arno/lychee
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Improved fullscreen using CSS

Browse Source
This commit is contained in:
Tobias Reich 2014-03-26 20:49:00 +01:00
parent 64b8308ab2
commit 43d6b3d4cd
3 changed files with 17 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
assets/build/main.css
View File

File diff suppressed because one or more lines are too long

22
assets/css/imageview.css
View File

@ -9,7 +9,7 @@
display: none; display: none;
width: 100%; width: 100%;
min-height: 100%; min-height: 100%;
background-color: rgba(10,10,10,.99); background-color: rgba(10,10,10,.98);
-webkit-transition: background-color .3s; -webkit-transition: background-color .3s;
} }
@ -19,7 +19,7 @@
background-color: inherit; background-color: inherit;
} }
#imageview.full { #imageview.full {
background-color: #040404; background-color: rgba(0,0,0,1);
} }
/* ImageView ------------------------------------------------*/ /* ImageView ------------------------------------------------*/
@ -47,12 +47,18 @@
animation-duration: .3s; animation-duration: .3s;
animation-timing-function: cubic-bezier(0.51,.92,.24,1.15); animation-timing-function: cubic-bezier(0.51,.92,.24,1.15);
} }
#imageview #image.small { #imageview #image.small {
top: 50%; top: 50%;
right: auto; right: auto;
bottom: auto; bottom: auto;
left: 50%; left: 50%;
} }
#imageview #image.full {
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
}
/* Previous/Next Buttons ------------------------------------------------*/ /* Previous/Next Buttons ------------------------------------------------*/
#imageview .arrow_wrapper { #imageview .arrow_wrapper {

14
assets/js/view.js
View File

@ -22,12 +22,7 @@ view = {
marginTop: -1*($("#imageview #image").height()/2)+20 marginTop: -1*($("#imageview #image").height()/2)+20
}); });
} else { } else {
$("#imageview #image").css({ $("#imageview #image").removeClass('full');
top: 60,
right: 30,
bottom: 30,
left: 30
});
} }
} }
@ -48,12 +43,7 @@ view = {
marginTop: -1*($("#imageview #image").height()/2) marginTop: -1*($("#imageview #image").height()/2)
}); });
} else { } else {
$("#imageview #image").css({ $("#imageview #image").addClass('full');
top: 0,
right: 0,
bottom: 0,
left: 0
});
} }
}, delay)); }, delay));
} }