Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developer.mozilla.org/en-US/docs/Web/API/CommandEvent below:

CommandEvent - Web APIs | MDN

Limited availability

The CommandEvent interface represents an event notifying the user when a button element with valid commandForElement and command attributes is about to invoke an interactive element.

This is the event object for the HTMLElement command event, which represents an action from an Invoker Control when it is invoked (for example when it is clicked or pressed).

CommandEvent()

Creates an CommandEvent object.

This interface inherits properties from its parent, Event.

CommandEvent.source Read only

An HTMLButtonElement representing the button that caused this invocation.

CommandEvent.command Read only

A string representing the command value of the source button.

<button commandfor="mypopover" command="show-popover">Show popover</button>

<div popover id="mypopover" role="[declare appropriate ARIA role]">
  <!-- popover content here -->
  <button commandfor="mypopover" command="hide-popover">Hide popover</button>
</div>

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

// …

popover.addEventListener("command", (event) => {
  if (event.command === "show-popover") {
    console.log("Popover is about to be shown");
  }
});

<button commandfor="the-image" command="--rotate-left">Rotate Left</button>

<button commandfor="the-image" command="--rotate-right">Rotate Right</button>

<img id="the-image" src="photo.jpg" alt="[add appropriate alt text here]" />

const image = document.getElementById("the-image");

image.addEventListener("command", (event) => {
  if (event.command == "--rotate-left") {
    event.target.style.rotate = "-90deg";
  } else if (event.command == "--rotate-right") {
    event.target.style.rotate = "90deg";
  }
});

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.3