Тултип

Это небольшая всплывающая подсказка с дополнительной информацией о функциях интерактивного элемента. Появляется при наведении курсора на элемент или взаимодействии с ним с клавиатуры. Это распространённый паттерн в веб-интерфейсах.

Тултип полезен, когда у элемента нет подписи, только иконка. Или когда нужно подробнее раскрыть его назначение.

Тултип может быть двух типов:
- статичный — будет показываться только с одной, заранее выбранной, стороны;
- адаптивный — будет появляться сверху, справа, снизу и слева от элемента в зависимости от наличия свободного места на экране.

В статье разберём три способа создания тултипа:
- Статичный.
- Адаптивный на основе Intersection Observer.
- Адаптивный на основе Popover API и CSS Anchor Positioning.

👉 @frontendInterview