Доброго времени суток, есть анимация, вращаются несколько свгшек.
На белом фоне все норм, но на темном почему-то остается след из искажений и затем пропадает, и появляется вновь.
Что это такое?) Откуда и как можно убрать?)
UPD: Проблема есть на винде в браузерах Хром и Яндекс, Опера и Мозила работают без нареканий.
о чем речь: (самый первый блок)
https://an6re9.github.io/dist/
код анимации:
function rotating() {
const planets = document.querySelectorAll(".planet");
const parentContainer = document.querySelector(
".page-presentation__view-back"
);
// angle не должен иметь конкретное значение, он должен увеличиваться с каждым кадром в цикле animate().
// Это позволяет планетам "вращаться" вокруг центра.
let angle = 0;
const centerX = parentContainer.offsetWidth / 2;
const centerY = parentContainer.offsetHeight / 2;
let running = true;
function animate() {
if (!running) return;
planets.forEach((planet, index) => {
const orbitWidth = parseInt(planet.dataset.orbitWidth);
const speed = Number(planet.dataset.planetSpeed);
// console.log(speed);
angle += speed;
const x = centerX + orbitWidth * Math.cos(angle + (index * Math.PI) / 2);
const y = centerY + orbitWidth * Math.sin(angle + (index * Math.PI) / 2);
planet.style.left = x + "px";
planet.style.top = y + "px";
});
requestAnimationFrame(animate);
}
