feat: openDetailsForHash with scrollIntoView

Author: toshimaru

src/assets/js/app.js

@@ -1,6 +1,9 @@
 document.addEventListener("DOMContentLoaded", () => {
   anchors.options = { visible: "always" };
   anchors.add();
+
+  window.addEventListener("hashchange", openDetailsForHash);
+  openDetailsForHash();
 });
 
 $(() => {
@@ -10,19 +13,6 @@ $(() => {
   });
   hljs.highlightAll();
 
-  // Open details that is at the same level as the target of the hash
-  window.addEventListener("hashchange", () => {
-    const target = document.querySelector(window.location.hash);
-    if (!target) return;
-
-    const siblingDetails = target
-      .closest("div.method")
-      ?.querySelector("details");
-    if (siblingDetails) {
-      siblingDetails.open = true;
-    }
-  });
-
   $("#navigation").load(`${config.rootPath}navigation.html`, () => {
     $(".sidebar-sticky .icon").on("click", function (e) {
       e.preventDefault();
@@ -35,3 +25,17 @@ $(() => {
       .show();
   });
 });
+
+// Open details that is at the same level as the target of the hash
+function openDetailsForHash() {
+  const hash = window.location.hash;
+  if (!hash) return;
+  const target = document.querySelector(hash);
+  if (!target) return;
+
+  const siblingDetails = target.closest("div.method")?.querySelector("details");
+  if (siblingDetails) {
+    siblingDetails.open = true;
+    target.scrollIntoView({ behavior: "smooth", block: "start" });
+  }
+}