Svg rewind работает в Firefox, а не в Chrome ⇐ Javascript

[Anonymous]

Вот фрагмент, где пользователь контролирует прогресс SVG с использованием слайдера. Он работает в Firefox. Но в Chrome, после того, как поскольку по какой -то причине скользит его до самого конца, по какой -то причине скольжение заставляет его перейти к первому кадру. Это звучит логично. Но затем зачем прыгать в первый кадр (вместо того, чтобы оставаться на последнем кадре, как Fill = "freeze" < /code>, указывает), когда пытается небольшой повторный вид.

Код: Выделить всё

const input = document.querySelector('input');
const animate = document.querySelector('animate');
const svg = document.querySelector('svg');

animate.beginElement();
svg.pauseAnimations();
const duration = animate.getSimpleDuration();

input.addEventListener('input', function() {
svg.setCurrentTime(this.value / 100 * duration);
});< /code>

Проблема может быть решена путем удаления begin = "endefinite" . Но это может ограничить другие варианты использования или требовать хакерских обходных путей. begin = «неопределенное» вызывает анимации начинать воспроизведение «неудержимо», что мы, возможно, не хотели, поэтому нам придется отслеживать все вновь появляющиеся элементы SVG во всем мире и взломать их, и это может сломать функциональность некоторых третьих библиотек, которые не ожидают таких изменений. Например, я попытался вызвать animate.beginement () и svg.pauseanimations () снова после ввода. Возможно, страннее, неинтерактивный пример. Его результаты по таким фрагментам в Chrome выглядят 99% случаев, как в Firefox. But rarely in SO snippets and every time I tried as a standalone HTML file (with JS code appended in a tag), they look different from Firefox.

Код: Выделить всё

const input = document.querySelector('input');
const animate = document.querySelector('animate');
const svg = document.querySelector('svg');

animate.beginElement();
svg.pauseAnimations();
svg.setCurrentTime(1);
requestAnimationFrame(() => {
svg.setCurrentTime(0.5);
});< /code>

Подробнее здесь: https://stackoverflow.com/questions/797 ... -in-chrome