Как сделать такой блок на чистом css3?

Question

[fastkulob]

Как сделать такой блок типа вверху страницы блок с картинками который каждый 3 секунды автоматически перелиствывается и новая картинка ну вы наверное поняли. Как это на чистом CSS3 сделать. Спасибо заранее.

Comments

[Maxwiwi]

Может ты имеешь в виду слайдер?Можно сделать на css,но без автоматического пролистывания

[snap44]

Maxwiwi,

без автоматического пролистывания

https://codepen.io/Eliteware/pen/BoBgqV

Answer 1

[msdosx86]

никак

Comments

[Алексей Ярков]

Это вы поняли из "ну вы наверное поняли"?

[msdosx86]

Алексей Ярков, нет, просто это на самом деле невозможно

[Александр Таратин]

msdosx86, Совсем рандомные картинки не сделать, но из предопределенного набора вполне.
Можно даже лоадер для webpack написать, который возьмет из директории все изображения и сгенерит для них соответствующий css код для анимаций - естественно заниматься такими вещами целесообразно лишь ради фана.

Answer 2

[ЛС]

Создаешь такой блок типа вверху страницы блок с картинками, а потом добавляешь к нему стили в файле стилей. Дальше нужен будет JS, потому что, как ты наверное понял, такая штуууука на чистом ccs3 не сделается.

Comments

[alex-1917]

ну типа такая ванилька, да?
)))

[ЛС]

Ванилька? Может быть )))

Answer 3

[Александр Таратин]

https://speckyboy.com/open-source-carousel-sliders-css/
https://corpocrat.com/2015/12/09/20-cool-pure-css-...

Answer 4

[Михаил Криворучко]

Я вот прикинул, можно через position наложить фотки друг на друга и через css3 анимации изменять изменять transform: translate(-100%, 0)
>
transform: translate(0%, 0)
>
transform: translate(100%, 0)

https://www.w3schools.com/css/css3_animations.asp

Но получиться довольно запутано и будет сложно дабавить новые слайды.