Предотвращение реакции JavaScript / jQuery на мышь из-под большого стека - PullRequest
0 голосов
/ 09 января 2020

Я использую этот плагин в WordPress, который создает красивые карты изображений с фигурами поверх изображений. Он широко использует JS / jQuery. Я использовал собственный скрипт, чтобы показать / скрыть div, когда я щелкаю форму. Этот конкретный div расположен над div, который содержит карту изображения. Он появляется и исчезает очень хорошо, но когда я нащупываю его и / или щелкаю по нему, по какой-то странной причине зависания и щелчки проходят через более сложный div вниз к div карты, все еще работая над popover. Вот упрощенная версия того, как все настроено:

function toggle_visibility(id) {
  var e = document.getElementById(id);
  if (e.style.opacity == '1')
    setTimeout(() => {
      e.style.opacity = '0';
    }, this.animationDelay + 2),
    setTimeout(() => {
      e.style.zIndex = '-30';
    }, 400);
  else
    e.style.zIndex = '999999999',
    setTimeout(() => {
      e.style.opacity = '1';
    }, this.animationDelay + 2);
}
.city {
  position: relative;
}

#ipano {
  position: fixed;
  min-width: 90vw;
  left: 5vw;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  z-index: -30;
}
<div class="city">
  // map code
</div>

<div id="ipano">
  //popup code
</div>

Плагин карты позволяет мне назначить код onClick для любой определенной фигуры, поэтому я добавил это, чтобы щелкнуть мышью по фигуре, чтобы открыть скрытый div примерно так: toggle_visibility('ipano'); javascript:event.preventDeafult();.

Но даже если я удаляю свой собственный скрипт для раскрытия #ipano div, проблема все еще сохраняется. Вы можете увидеть это в действии здесь .

Я думаю, что это как-то связано со скриптом карты и с тем, как он обрабатывает отображение областей оверлейной карты (с .svg), но я я не могу указать на это.

Я попытался изменить порядок в div, удалив бит protectDefault и добавив события-указатели: none; некоторым элементам карты, но это не помогло. Как это вообще возможно?

Любые предложения в правильном направлении, очень ценю, спасибо!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...