now fade-in should work better on slow devices...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2023-08-18 02:58:23 +03:00
parent 5de338af1b
commit 2c243b4132
2 changed files with 13 additions and 2 deletions

View File

@ -15,6 +15,7 @@
- ~~draggable?~~ (needs tweaking) - ~~draggable?~~ (needs tweaking)
- ~~handle wrapping better (collapsed / expandend)~~ - ~~handle wrapping better (collapsed / expandend)~~
might still need to resize to content on multiline... might still need to resize to content on multiline...
- Lightbox: hide cursor on timeout...
- Lightbox: hover indicators: - Lightbox: hover indicators:
- start/end (a-la ImageGrid.Viewer??) - start/end (a-la ImageGrid.Viewer??)
- next/prev - next/prev

View File

@ -11,8 +11,13 @@
<script src="grid-n-view.js"></script> <script src="grid-n-view.js"></script>
<style> <style>
body.splash {
opacity: 0;
}
/* fade-in body... */ /* fade-in body... */
body { /* XXX add real splash screen... */
body:not(.splash) {
animation: fadeInAnimation ease 2s; animation: fadeInAnimation ease 2s;
animation-iteration-count: 1; animation-iteration-count: 1;
animation-fill-mode: forwards; animation-fill-mode: forwards;
@ -46,10 +51,15 @@ var restoreScroll = function(){
(sessionStorage.windowScrollX ?? 0)*1, (sessionStorage.windowScrollX ?? 0)*1,
sessionStorage.windowScrollY*1) }, SCROLL_TIMEOUT ?? 100) } sessionStorage.windowScrollY*1) }, SCROLL_TIMEOUT ?? 100) }
var pageSetup = function(){
setup()
restoreScroll()
document.body.classList.remove('splash') }
</script> </script>
</head> </head>
<body onload="setup(); restoreScroll()"> <body onload="pageSetup()" class="splash">
<h3>Keyboard controls</h3> <h3>Keyboard controls</h3>