Merge pull request #101 from reynog/patch-1

Suggested change to viewer
This commit is contained in:
Ricter Zheng 2020-01-18 19:50:04 +08:00 committed by GitHub
commit bc29869a8b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 11 deletions

View File

@ -17,6 +17,8 @@ function changePage(pageNum) {
const display = document.getElementById('dest'); const display = document.getElementById('dest');
display.style.backgroundImage = `url("${current.src}")`; display.style.backgroundImage = `url("${current.src}")`;
scroll(0,0)
document.getElementById('page-num') document.getElementById('page-num')
.innerText = [ .innerText = [
(pageNum + 1).toLocaleString(), (pageNum + 1).toLocaleString(),
@ -47,6 +49,8 @@ document.onkeypress = event => {
switch (event.key.toLowerCase()) { switch (event.key.toLowerCase()) {
// Previous Image // Previous Image
case 'w': case 'w':
scrollBy(0, -40);
break;
case 'a': case 'a':
changePage(currentPage - 1); changePage(currentPage - 1);
break; break;
@ -57,6 +61,8 @@ document.onkeypress = event => {
// Next Image // Next Image
case ' ': case ' ':
case 's': case 's':
scrollBy(0, 40);
break;
case 'd': case 'd':
changePage(currentPage + 1); changePage(currentPage + 1);
break; break;
@ -69,13 +75,11 @@ document.onkeydown = event =>{
changePage(currentPage - 1); changePage(currentPage - 1);
break; break;
case 38: //up case 38: //up
changePage(currentPage - 1);
break; break;
case 39: //right case 39: //right
changePage(currentPage + 1); changePage(currentPage + 1);
break; break;
case 40: //down case 40: //down
changePage(currentPage + 1);
break; break;
} }
}; };

View File

@ -17,8 +17,8 @@ html, body {
} }
#list { #list {
height: 100%; height: 2000px;
overflow: auto; overflow: scroll;
width: 260px; width: 260px;
text-align: center; text-align: center;
} }
@ -37,7 +37,7 @@ html, body {
#image-container { #image-container {
flex: auto; flex: auto;
height: 100vh; height: 2000px;
background: #222; background: #222;
color: #fff; color: #fff;
text-align: center; text-align: center;
@ -48,16 +48,16 @@ html, body {
} }
#image-container #dest { #image-container #dest {
height: 100%; height: 2000px;
width: 100%; width: 100%;
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: top;
} }
#image-container #page-num { #image-container #page-num {
position: absolute; position: static;
font-size: 18pt; font-size: 14pt;
left: 10px; left: 10px;
bottom: 5px; bottom: 5px;
font-weight: bold; font-weight: bold;