monks/overlay

{{SeeCompatTable}}

The overlay CSS property specifies whether an element appearing in the top layer (for example, a shown popover or modal {{htmlelement(“dialog”)}} element) is actually rendered in the top layer. This property is only relevant within a list of {{cssxref(“transition-property”)}} values, and only if allow-discrete is set as the {{cssxref(“transition-behavior”)}}.

It is important to note that overlay can only be set by the browser — author styles cannot change the overlay value of any element. You can, however, add overlay to the list of transition properties set on an element. This causes its removal from the top layer to be deferred so it can be animated instead of disappearing immediately.

When transitioning overlay, you need to set transition-behavior: allow-discrete on the transition so that it will animate. overlay animations differ from normal discrete animations in that the visible (i.e., auto) state will always be shown for the full duration of the transition, regardless of whether it is the start or end state.

pub const auto_: #(String, String)

pub const inherit: #(String, String)

pub const initial: #(String, String)

pub const none: #(String, String)

pub fn raw(value: String) -> #(String, String)

pub const revert: #(String, String)

pub const revert_layer: #(String, String)

pub const unset: #(String, String)

pub fn var(variable: String) -> #(String, String)