An overlay component is a component that comes above the actual components in a absolute position.
In Html, it would have a higher value on the z scale (ie z-index)
When two elements overlay each other, they overlap.
Because they differ only in their characteristics, most libraries offer them all.
All these elements are overlays:
- A modal needs a click to show up
- A dialog generally wraps a form.
- A popover - An interactive mini-dialog floating element that displays information related to an anchor element when the element is clicked.
- UI - Tooltip / Popup shows generally when the pointer goes over an element to add context
- UI - DropDown - they are used in menus and forms to show a list of choice
- A lightbox needs a click to show up and shows a video or image against a dark background.
Most software that will help to create overlay are positioning library