css - SVG动画背景停止向下滚动约一半

test.html：

<body style="background-image:url(test.svg);background-size:cover">
    <div style="height:2000px"> Hello! </div>
</body>

test.svg（摘自https://developer.mozilla.org/en-US/docs/Web/SVG/Element/animate）：

<?xml version="1.0"?>
<svg width="120" height="120" viewBox="0 0 120 120" version="1.1"
     xmlns="http://www.w3.org/2000/svg">

  <rect x="10" y="10" width="100" height="100">
    <animate attributeType="XML" attributeName="x" from="-100" to="120"
        dur="10s" repeatCount="indefinite"/>
  </rect>
</svg>

当我向下滚动大约一半时，动画暂停（实际上，停止刷新）。不知道为什么。在SVG规范或Google chrome文档中找不到任何内容。

我的浏览器版本Chromium 73.0.3683.86 Built on Ubuntu, running on LinuxMint 18.

SVG动画背景停止向下滚动约一半

0 个答案: