ToggleEvent: ToggleEvent() constructor

Baseline 2025
Newly available

Since January 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

The ToggleEvent() constructor creates a new ToggleEvent object.

Syntax

js
new ToggleEvent(type, init)

Parameters

type

A string representing the type of event. In the case of ToggleEvent this is always beforetoggle or toggle.

init

An object containing the following properties:

newState

A string representing the state the element is transitioning to. Possible values are "open" and "closed".

oldState

A string representing the state the element is transitioning from. Possible values are "open" and "closed".

Examples

A developer would not use this constructor manually. A new ToggleEvent object is constructed when a handler is invoked as a result of a relevant event firing.

For example:

js
const popover = document.getElementById("mypopover");

// ...

popover.addEventListener("beforetoggle", (event) => {
  if (event.newState === "open") {
    console.log("Popover is being shown");
  } else {
    console.log("Popover is being hidden");
  }
});

Specifications

Specification
HTML
# toggleevent

Browser compatibility

See also