Add scroll-to-top button for mobile advanced atlas
This commit is contained in:
parent
1a31be229d
commit
d839503c1e
3 changed files with 28 additions and 0 deletions
23
items_2.css
23
items_2.css
|
@ -114,3 +114,26 @@
|
||||||
margin: 0 0 14px;
|
margin: 0 0 14px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#scroll-up {
|
||||||
|
width: 10vw;
|
||||||
|
height: 10vw;
|
||||||
|
bottom: 4vw;
|
||||||
|
right: 4vw;
|
||||||
|
position: fixed;
|
||||||
|
display: none;
|
||||||
|
background-color: #212121;
|
||||||
|
font-size: 12pt;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 10vw;
|
||||||
|
border: 1px solid #666;
|
||||||
|
cursor: pointer;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media(max-width: 1099px) {
|
||||||
|
#scroll-up {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -58,6 +58,7 @@
|
||||||
<div class="center" id="item-list-footer"></div>
|
<div class="center" id="item-list-footer"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="scroll-up">↑</div>
|
||||||
<script type="text/javascript" src="utils.js"></script>
|
<script type="text/javascript" src="utils.js"></script>
|
||||||
<script type="text/javascript" src="build_utils.js"></script>
|
<script type="text/javascript" src="build_utils.js"></script>
|
||||||
<script type="text/javascript" src="loadheader.js"></script>
|
<script type="text/javascript" src="loadheader.js"></script>
|
||||||
|
|
|
@ -404,6 +404,10 @@ function init_items2() {
|
||||||
// focus the query filter text box
|
// focus the query filter text box
|
||||||
searchFilterField.field.focus();
|
searchFilterField.field.focus();
|
||||||
searchFilterField.field.select();
|
searchFilterField.field.select();
|
||||||
|
|
||||||
|
// scroll-to-top button
|
||||||
|
document.getElementById('scroll-up')
|
||||||
|
.addEventListener('mousedown', e => scrollTo({ top: 0, behavior: 'smooth' }));
|
||||||
}
|
}
|
||||||
|
|
||||||
load_init(init_items2);
|
load_init(init_items2);
|
||||||
|
|
Loading…
Reference in a new issue