Как показать правильное положение всплывающей подсказки в сочетании «реакция + реакция-портал-подсказка»? - PullRequest
0 голосов
/ 14 января 2019

Возникли проблемы, и я хочу использовать лучшие практики для их устранения или просто заставить их работать так, как ожидалось:)

Я использую реагировать-портал-подсказку .

<div data-reactroot="" style="position: absolute; padding: 5px; background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 8px; border-radius: 3px; transition: all 0.3s ease-in-out 0s, visibility 0.3s ease-in-out 0s; opacity: 1; visibility: visible; z-index: 50; top: 114.094px; left: 803.984px;"><div><span style="position: absolute; content: &quot;&quot;; transition: all 0.3s ease-in-out 0s; z-index: 60; top: 50%; border-top: 8px solid transparent; border-bottom: 8px solid transparent; margin-top: -7px; right: -10px; border-left: 10px solid rgb(255, 255, 255);"></span><span style="position: absolute; content: &quot;&quot;; transition: all 0.3s ease-in-out 0s; z-index: 55; border-top: 9px solid transparent; border-bottom: 9px solid transparent; top: 50%; margin-top: -8px; right: -11px; border-left: 11px solid rgba(0, 0, 0, 0.4);"></span></div><span>Mandatory</span></div>

Мы попали сюда top: 114.094px; left: 803.984px; Он прекрасно работает, и я получил эту подсказку с текстом «Обязательно».

enter image description here

Но затем я решаю прокрутить вниз и эту подсказку, если она следует за мной, я не хочу, чтобы она следовала за мной, она не будет изменять верхнее и левое значения, пока я не наведу на нее курсор!

enter image description here

Я не могу реализовать это хорошим способом, и я прошу вас помочь =)

<ToolTip active={true} parent={`#${id}`} position="left" arrow="center" align="left">
    <span>Mandatory</span></ToolTip>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...