Просмотр исходного кода

Fix rare case of dropdown's list position in modal

If a dropdown is opened in a modal which, in its turn, is opened on page
which is scrolled, dropdown's list position wouldn't be correct.
Because, in that case, the body's scroll is removed and it's top
property is set instead, so that the body can't be scrolled while a
modal is opened. This complicates the dropdown's list position.
Sergiu Miclea 8 лет назад
Родитель
Сommit
d18c16ada6
1 измененных файлов с 7 добавлено и 1 удалено
  1. 7 1
      src/components/molecules/Dropdown/Dropdown.jsx

+ 7 - 1
src/components/molecules/Dropdown/Dropdown.jsx

@@ -158,7 +158,13 @@ class Dropdown extends React.Component {
       this.tipRef.style.display = 'block'
       this.tipRef.style.display = 'block'
     }
     }
 
 
-    this.listRef.style.top = `${listTop + window.pageYOffset}px`
+    // If a modal is opened, body scroll is removed and body top is set to replicate scroll position
+    let scrollOffset = 0
+    if (parseInt(document.body.style.top, 10) < 0) {
+      scrollOffset = -parseInt(document.body.style.top, 10)
+    }
+
+    this.listRef.style.top = `${listTop + (window.pageYOffset || scrollOffset)}px`
     this.listRef.style.left = `${this.buttonRect.left}px`
     this.listRef.style.left = `${this.buttonRect.left}px`
   }
   }