A RetroSearch Logo

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

Search Query:

Showing content from http://developer.mozilla.org/de/docs/Web/API/SVGAnimationElement/beginEvent_event below:

SVGAnimationElement: beginEvent-Ereignis - Web-APIs | MDN

SVGAnimationElement: beginEvent-Ereignis

Limited availability

Das beginEvent-Ereignis des SVGAnimationElement-Interfaces wird ausgelöst, wenn die lokale Zeitachse des Elements zu spielen beginnt. Es wird jedes Mal ausgelöst, wenn das Element die aktive Dauer beginnt (d.h. wenn es neu startet, aber nicht, wenn es sich wiederholt).

Es kann sowohl während der normalen (d.h. geplanten oder interaktiven) Zeitachsenwiedergabe als auch im Fall ausgelöst werden, dass das Element mithilfe einer DOM-Methode gestartet wurde.

Dieses Ereignis ist nicht abbrechbar und wird nicht gebubbelt.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignishandler-Eigenschaft.

addEventListener("beginEvent", (event) => { })

onbegin = (event) => { }
Ereignistyp Ereigniseigenschaften
TimeEvent.detail Schreibgeschützt

Ein long, der einige Detailinformationen über das Ereignis angibt, abhängig vom Typ des Ereignisses. Für diesen Ereignistyp gibt es die Wiederholungsnummer der Animation an.

TimeEvent.view Schreibgeschützt

Ein WindowProxy, der das Fenster identifiziert, aus dem das Ereignis generiert wurde.

Beispiele Animierter Kreis
<svg xmlns="http://www.w3.org/2000/svg" width="300px" height="100px">
  <title>SVG SMIL Animate with Path</title>
  <circle cx="0" cy="50" r="50" fill="blue" stroke="black" stroke-width="1">
    <animateMotion path="M 0 0 H 300 Z" dur="5s" repeatCount="indefinite" />
  </circle>
</svg>

<hr />

<ul></ul>
ul {
  height: 100px;
  border: 1px solid #dddddd;
  overflow-y: scroll;
  padding: 10px 30px;
}
let svgElem = document.querySelector("svg");
let animateElem = document.querySelector("animateMotion");
let list = document.querySelector("ul");

animateElem.addEventListener("beginEvent", () => {
  let listItem = document.createElement("li");
  listItem.textContent = "beginEvent fired";
  list.appendChild(listItem);
});

animateElem.addEventListener("repeatEvent", (e) => {
  let listItem = document.createElement("li");
  let msg = "repeatEvent fired";
  if (e.detail) {
    msg += `; repeat number: ${e.detail}`;
  }
  listItem.textContent = msg;
  list.appendChild(listItem);
});
Äquivalent zur Ereignishandler-Eigenschaft

Beachten Sie, dass Sie auch einen Ereignislistener für das begin-Ereignis mithilfe der onbegin Ereignishandler-Eigenschaft erstellen können:

animateElem.onbegin = () => {
  console.log("beginEvent fired");
};
Spezifikationen Browser-Kompatibilität Siehe auch MDN-Feedback-Box War diese Übersetzung hilfreich?

Diese Seite wurde automatisch aus dem Englischen übersetzt.


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.4