ресурс JDBC из древесной рыбы [дубликат]

Я почти не отвечаю на вопрос с множеством ответов, но это решение имеет отличную совместимость, и я еще не видел его:

.hidden-element {
  position: absolute;
  z-index: -1;
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity .5s ease-out;
}

.hidden-element.visible {
  position: static;
  z-index: auto;
  pointer-events: auto;
  visibility: visible;
  opacity: 1;
}

Объяснение: он использует трюк visibility: hidden (который совместим с «show-and-animate» за один шаг), но использует комбинацию position: absolute; z-index: -1; pointer-events: none;, чтобы убедиться, что скрытый контейнер не занимает места и не отвечает на взаимодействия пользователя.