На странице незавершенного производства мы пытаемся скопировать движущуюся в облаке анимацию в CSS, и мы работаем с начальной загрузкой 4. Однако анимация работает, но она вызывает задержки на сайте при прокрутке сайта при запуске.Если вы прокручиваете вверх и вниз, курсор, кажется, «отстает от полосы прокрутки», начиная со второй строки таблицы.Тестовый сайт: http://dev.thedesignfactory.ro/monster-fitness/html/
Вот наш CSS для одного облака:
xxx .cloud1 {
opacity: 0;
width: 190px;
height: 80px;
top: 80px;
animation: cloud_anim 20s infinite;
animation-timing-function: linear;
will-change: transform;
position: absolute;
z-index: 10;
}
Мой соавтор заявляет, что он не отстает от своих тестовых устройств и компьютеров,но только на моем, поэтому я не уверен, есть ли какая-либо несовместимость, даже если мы используем одни и те же браузеры.Мы попытались воспроизвести анимацию с этого сайта: https://www.headspace.com/ Как вы видите, облака движутся слева направо и не вызывают задержек, и они также выполняются с помощью CSS.
Мы как быневежественны, и помощь очень ценится.