menu : save menu scroll position in localstorage

(ux improve)
This commit is contained in:
Aditya Telange 2020-08-21 21:03:05 +05:30
parent 274688f238
commit e17d61b46c
No known key found for this signature in database
GPG Key ID: 82E844EF3DA99E77
2 changed files with 9 additions and 1 deletions

View File

@ -16,6 +16,11 @@
{{ $highlight := resources.Get "js/highlight.min.js" | minify | fingerprint}} {{ $highlight := resources.Get "js/highlight.min.js" | minify | fingerprint}}
<script src="{{ $highlight.Permalink }}" integrity="{{ $highlight.Data.Integrity }}"></script> <script src="{{ $highlight.Permalink }}" integrity="{{ $highlight.Data.Integrity }}"></script>
<script> <script>
window.onload = function () {
if (localStorage.getItem("menu-scroll-position")) {
document.getElementById('menu').scrollLeft = localStorage.getItem("menu-scroll-position");
}
}
hljs.initHighlightingOnLoad(); hljs.initHighlightingOnLoad();
document.querySelectorAll('a[href^="#"]').forEach(anchor => { document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener("click", function (e) { anchor.addEventListener("click", function (e) {
@ -36,4 +41,7 @@
mybutton.style.opacity = "0"; mybutton.style.opacity = "0";
} }
}; };
function menu_on_scroll() {
localStorage.setItem("menu-scroll-position", document.getElementById('menu').scrollLeft);
}
</script> </script>

View File

@ -11,7 +11,7 @@
<p class="logo"><a href="{{ "" | absURL }}">{{ .Site.Title }}</a></p> <p class="logo"><a href="{{ "" | absURL }}">{{ .Site.Title }}</a></p>
{{- end }} {{- end }}
{{- if .Site.Menus.main }} {{- if .Site.Menus.main }}
<ul class="menu"> <ul class="menu" id="menu" onscroll="menu_on_scroll()">
{{- range .Site.Menus.main }} {{- range .Site.Menus.main }}
<li> <li>
<a href="{{ .URL }}">{{ .Name }}</a> <a href="{{ .URL }}">{{ .Name }}</a>