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/repeatEvent_event below:

SVGAnimationElement: repeatEvent-Ereignis - Web-APIs | MDN

SVGAnimationElement: repeatEvent-Ereignis

Limited availability

Das repeatEvent-Ereignis der SVGAnimationElement Schnittstelle wird ausgelöst, wenn die lokale Timeline des Elements wiederholt wird. Es wird jedes Mal ausgelöst, wenn das Element wiederholt wird, nach der ersten Iteration.

Hinweis: Mit dem repeatEvent-Ereignis ist eine ganze Zahl verknüpft, die angibt, welche Wiederholungsiteration beginnt; diese findet sich in der detail-Eigenschaft des Ereignisobjekts. Der Wert ist eine nullbasierte Ganzzahl, aber das Wiederholungsereignis wird bei der ersten Iteration nicht ausgelöst, sodass die beobachteten Werte >= 1 sind. Dies wird in Firefox unterstützt, jedoch nicht in Chrome.

Dieses Ereignis kann nicht abgebrochen werden und wird nicht weitergeleitet.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener(), oder setzen Sie eine Ereignishandlereigenschaft.

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

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

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

TimeEvent.view Schreibgeschützt

Ein WindowProxy, das 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);
});
Entsprechende Ereignishandlereigenschaft

Beachten Sie, dass Sie auch einen Ereignislistener für das repeat-Ereignis mithilfe der onrepeat-Ereignishandlereigenschaft erstellen können:

animateElem.onrepeat = () => {
  console.log("repeatEvent 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