smooth scrolling for anchor links that are not in the menu

js/navigation.js

@@ -17,14 +17,19 @@ function toggleMenu(){
 }
 window.onhashchange = () => {hashChange()}
 function hashChange(){
-    if(sessions.length > 0){
-        if (window.location.hash == ""){
-            window.scrollTo({top: 0,behavior: 'smooth' })
-            return;
+    if(sessions.length > 0) {
+        let hash = window.location.hash;
+        if (hash == ""){
+            window.scrollTo({top: 0})
         }
-        let session = sessions.filter(session => session.hash == window.location.hash.substring(1))[0]
-        if(typeof session != "undefined"){
-            window.scrollTo({top: session.index == 0 ? 0 :session.margin + (session.height/2), behavior: 'smooth' })
+        else {
+            let session = sessions.filter(session => session.hash == window.location.hash.substring(1))[0]
+            if (typeof session != "undefined") {
+                window.scrollTo({top: session.index == 0 ? 0 :session.margin + (session.height/2)})
+                return
+            }
+            let element = document.getElementById(hash);
+            if (element) element.scrollIntoView();
         }
     }
 }

js/scrolling.js

@@ -8,14 +8,12 @@ function updateCursor(currentSession,currentProgress) {
     let cursor = d3.select('#cursor')
     //update the cursor if the session changes
     if (lastSession == null || lastSession.index != currentSession.index) {
-        console.log(currentSession);
         cursor.html(marked.parse(currentSession.text))
         lastSession = currentSession
         document.getElementById('anchors').childNodes.forEach(childNode => {childNode.classList.remove('active')})
         let currentNav = document.querySelector('#anchors .'+currentSession.hash)
         if (currentNav!= null) {
             currentNav.classList.add('active')
-            // console.log(currentSession.index);
         }
     }
     //update the cursor dimension and the position according to the scrolling progress of the session

style.css

@@ -23,6 +23,9 @@
     font-weight: bold;
 }
 /* Global styles*/
+html {
+    scroll-behavior: smooth;
+}
 body{
     --background-menu: hsl(0, 0%, 100%);
     --background: hsl(0, 0%, 94%);