lock wrapper scroll when popover is shown.

d-i-t-a · Mar 1, 2022 · 6a68c6b · 6a68c6b
1 parent 93dfa03
commit 6a68c6b
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 18 deletions.
diff --git a/src/modules/linefocus/LineFocusModule.ts b/src/modules/linefocus/LineFocusModule.ts
@@ -161,31 +161,31 @@ export default class LineFocusModule implements ReaderModule {
 
   private keydown(event: KeyboardEvent | MouseEvent | TrackEvent): void {
     if (event instanceof KeyboardEvent && this.isActive) {
-        const key = event.key;
-        switch (key) {
-          case "ArrowUp":
+      const key = event.key;
+      switch (key) {
+        case "ArrowUp":
           event.stopPropagation();
-            break;
-          case "ArrowDown":
+          break;
+        case "ArrowDown":
           event.stopPropagation();
-            break;
-        }
+          break;
       }
     }
+  }
 
   private keyup(event: KeyboardEvent | MouseEvent | TrackEvent): void {
     if (event instanceof KeyboardEvent && this.isActive) {
-        const key = event.key;
-        switch (key) {
-          case "ArrowUp":
-            this.lineUp();
-            break;
-          case "ArrowDown":
-            this.lineDown();
-            break;
-        }
+      const key = event.key;
+      switch (key) {
+        case "ArrowUp":
+          this.lineUp();
+          break;
+        case "ArrowDown":
+          this.lineDown();
+          break;
       }
     }
+  }
 
   handleResize() {
     if (this.isActive) {

diff --git a/src/modules/search/Popup.ts b/src/modules/search/Popup.ts
@@ -67,6 +67,11 @@ export class Popup {
     if (footnote) {
       footnote.parentElement?.removeChild(footnote);
     }
+    const wrapper = HTMLUtilities.findRequiredElement(
+      document,
+      "#iframe-wrapper"
+    );
+    wrapper.style.overflow = "auto";
   }
 
   async showPopover(link: HTMLLIElement, event: MouseEvent | TouchEvent) {
@@ -97,6 +102,7 @@ export class Popup {
           document,
           "#iframe-wrapper"
         );
+        wrapper.style.overflow = "hidden";
         d2popover.style.top = wrapper.scrollTop + "px";
         d2popover.style.height = wrapper.clientHeight * 0.9 + "px";
 
@@ -122,11 +128,11 @@ export class Popup {
         if (!win) {
           return;
         }
+        let self = this;
         win.onclick = function (ev) {
           if (event.target !== ev.target) {
             if (d2popover.parentElement) {
-              d2popover.style.display = "none";
-              d2popover.parentElement.removeChild(d2popover);
+              self.hidePopover();
               if (win) {
                 win.onclick = null;
               }