edkiimrgnl
@edkiimrgnl
человек с невидимыми талантами.

Как сделать бесконечную зацикленную анимацию, можно js(jquery) или css?

Нужно сделать анимацию, бесконечную, чтобы залетая в одну часть экрана, обьект сразу же вылезал из противоположной.
Получается просто зациклить, информацию нигде не могу найти. Каждый раз все объекты просто уходят за экран и после полного исчезновения всех появляются снова.

код анимации
(будет круто если будет jquery или нативный, а то сбивается параллакс)
.parallax {
    width: 100%;
    height: 100%;

    &__grey-circle,
    &__white-circle,
    &__red-circle {
        animation: animate 30s linear infinite;
    }
}

@keyframes animate {
    0% {
        transform: translateY(100%);
    }
    100% {
        transform: translateY(-100%);
    }
}
  • Вопрос задан
  • 60 просмотров
Пригласить эксперта
Ответы на вопрос 1
@Karpion
Самый простой способ: проверять координаты каждого объекта отдельно; и если они выходят за рамки, то приводить их снова куда надо, прибавляя или вычитая ширину/высоту экрана.

Возможно, объект надо будет отрисовывать несколько раз. Если объект пересекает вертикальную или горизонтальную границу экрана - то дважды; если накрывает угол - то четыре раза.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы