Как работает "3D Meninas" (CSS / Animation)?

Question

Сегодня я нашел этот сайт, "3D Meninas" , с приятным эффектом 3D-анимации. Когда я смотрю на код HTML, кажется, что <script> или события нет, поэтому я предполагаю, что он работает только с CSS. Я не гуру CSS, может кто-нибудь сказать мне как это работает?

Спасибо

Answer 1

Изображение делится на около сотни вертикальных «кусочков». При наведении курсора на каждый фрагмент каждое изображение размещается точно и жестко.

Элемент с наибольшей глубиной, правая стена, просто сдавливается и растягивается путем изменения атрибута width.

Edit:

Вот официальное объяснение создателя.

Answer 2

Работает, разделяя изображение по вертикали на отдельные пиксели и имея псевдокласс css hover для каждого. Есть 505 упоминаний о слове парения. Если вы смотрите на источник в средстве просмотра, которое не переносит строки, обратите внимание, что строки внизу очень длинные (прокрутка вправо).