SVGSVGElement:pauseAnimations() 方法

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

SVGSVGElement 介面的 pauseAnimations() 方法會暫停(即停止)與此 <svg> 元素對應的 SVG 文件片段中定義的所有當前正在執行的動畫,導致此文件片段的動畫時鐘停止,直到再次被取消暫停。

語法

js
pauseAnimations()

引數

無。

返回值

無(undefined)。

示例

暫停動畫

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.";
});

規範

規範
SVG 動畫級別 2
# __svg__SVGSVGElement__pauseAnimations

瀏覽器相容性

另見