SVGSVGElement: pauseAnimations() Methode
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
Die pauseAnimations()-Methode der SVGSVGElement-Schnittstelle unterbricht (d.h. pausiert) alle derzeit laufenden Animationen, die innerhalb des SVG-Dokumentfragments definiert sind, das diesem <svg>-Element entspricht. Dadurch bleibt die Animationsuhr, die zu diesem Dokumentfragment gehört, stehen, bis sie wieder fortgesetzt wird.
Syntax
js
pauseAnimations()
Parameter
Keine.
Rückgabewert
Keiner (undefined).
Beispiele
Pausieren von Animationen
html
<svg id="exampleSVG" width="200" height="100">
<circle cx="50" cy="50" r="30" fill="blue">
<animate
attributeName="cx"
from="50"
to="150"
dur="2s"
repeatCount="indefinite" />
</circle>
</svg>
<button id="pauseBtn">Pause Animations</button>
<pre id="status"></pre>
js
const svgElement = document.getElementById("exampleSVG");
const pauseButton = document.getElementById("pauseBtn");
const statusDisplay = document.getElementById("status");
pauseButton.addEventListener("click", () => {
svgElement.pauseAnimations();
statusDisplay.textContent = "Animations paused.";
});
Spezifikationen
| Specification |
|---|
| SVG Animations Level 2 # __svg__SVGSVGElement__pauseAnimations |
Browser-Kompatibilität
BCD tables only load in the browser