Как сделать подобную циклическую анимацию (эффект бегущей строки)?

Question

[kn1ght_t]

ссылка на фидл

нужно сделать так, чтобы эти квадраты бесконечно двигались слева направо, то есть уходили за правую часть экрана из-под левой части экрана и т.д.

Answer 1

[Денис Инешин]

В этом деле вам помогут: Keyframes. Вот пособие.

Comments

[kn1ght_t]

ерунда у меня получается)) jsfiddle.net/brds6at3/1

[Денис Инешин]

kn1ght_t: jsfiddle.net/IonDen/brds6at3/2 а у меня норм)

[Денис Инешин]

kn1ght_t: ну примерно) Фича в том, что вам не нужно двигать всю область, а нужно двигать только на 1 шаг и сбрасывать назад.

[kn1ght_t]

Денис Инешин: фишка интересная, но такое не прокатит, т.к. каждый квадрат будет со своим контентом уникальным) например, представим, что каждый квадрат- это картинка) тогда она будет странно это выглядеть )) jsfiddle.net/brds6at3/3

[Денис Инешин]

kn1ght_t: в этой ситуации нужно просто продублировать контент в 2 раза дальше и сделать шаг не в одну ячейку, а в несколько.