Fix navigation on Android Chrome

assets/navigation-scroll-fix.js

@@ -0,0 +1,17 @@
+window.addEventListener("load", function() {
+    for (let link of document.querySelectorAll("nav a")) {
+        link.addEventListener("click", function() {
+            let fragmentIndex = link.href.indexOf("#");
+            let anchor = null;
+            if (fragmentIndex >= 0) {
+                let fragment = link.href.substring(fragmentIndex + 1, link.href.length);
+                anchor = document.getElementById(fragment);
+            }
+            if (anchor) {
+                document.documentElement.scrollTop += anchor.getBoundingClientRect().y;
+            } else {
+                document.documentElement.scrollTop = 0;
+            }
+        });
+    }
+});

assets/navigation.js

@@ -15,7 +15,7 @@ window.addEventListener("load", function() {
     for (let section of document.querySelectorAll("section")) {
         let id = section.getAttribute("id");
         let link = nav.querySelector("a[href=\\#" + id.replace(/\//g, "\\/") + "]");
-        if (link !== null) {
+        if (link) {
             link = link.parentElement;
             link.classList.remove("active");
             sections.push([section, link]);
@@ -43,13 +43,12 @@ window.addEventListener("load", function() {
             }
             link = link.parentElement;
         }
-        if (link === null) {
-            nav.scrollTop = 0;
-        } else {
+        if (link) {
             let topLink = link.getBoundingClientRect().y;
             let topNav = nav.getBoundingClientRect().y;
-            let y = nav.scrollTop + topLink - topNav - 10;
-            nav.scrollTo(0, y);
+            nav.scrollTop += topLink - topNav - 10;
+        } else {
+            nav.scrollTop = 0;
         }
     }
     function resizeNav() {

assets/screen-narrow.css

@@ -19,15 +19,16 @@ header .logoContainer, header ul, main {
 
 nav {
     position: fixed;
-    width: 0;
+    width: 100vw;
     height: 100vh;
     top: 0;
     left: 0;
     background-color: #E4E9F6;
     z-index: 1;
-    transition: width ease .2s;
     max-height: initial !important;
     margin: 0;
+    transform: translate(-100vw);
+    transition: transform ease .2s;
 }
 
 html.nav-opened {
@@ -35,7 +36,7 @@ html.nav-opened {
 }
 
 .nav-opened nav {
-    width: 100vw;
+    transform: translate(0);
 }
 
 main, .navContainer {

documentation-generator/template.html

@@ -20,6 +20,7 @@ $endif$
 <script src="assets/navigation.js"></script>
 <script src="assets/document-branches.js"></script>
 <script src="assets/narrow-menu.js"></script>
+<script src="assets/navigation-scroll-fix.js"></script>
 <script>
     const documentBranch = "$branch$";
     const documentBranches = ["$for(branches)$$branches$$sep$", "$endfor$"];