SVGSVGElement: phương thức pauseAnimations()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Phương thức pauseAnimations() của giao diện SVGSVGElement tạm dừng tất cả các hoạt hình đang chạy hiện tại được xác định trong mảnh tài liệu SVG tương ứng với phần tử <svg> này, khiến đồng hồ hoạt hình tương ứng với mảnh tài liệu này đứng yên cho đến khi được tiếp tục.

Cú pháp

pauseAnimations()

<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">Tạm dừng hoạt hình</button>
<pre id="status"></pre>

const svgElement = document.getElementById("exampleSVG");
const pauseButton = document.getElementById("pauseBtn");
const statusDisplay = document.getElementById("status");

pauseButton.addEventListener("click", () => {
  svgElement.pauseAnimations();
  statusDisplay.textContent = "Animations paused.";
});