jquery/css folding animation effect

Question

Как создать эффект складывания «div» по горизонтали, нажав на дочерний элемент (см. Ниже)?

Answer 1

Эффект достигается с помощью двух плоских поверхностей, которые складываются друг над другом с помощью CSS 3D. (перспектива & преобразуется)

Плоские плоскости должны показывать содержимое, но поскольку они представляют собой два отдельных элемента, нам нужно взять исходное содержимое и дублировать DOM на обе плоскости нашей складки.

Затем с использованием переходов CSS для анимации сгиба.

Чем больше складок у вас есть, тем больше плоских самолетов вам нужно с дубликатами содержимого внутри них.

Примером полной реализации может служить: http://felixniklas.com/paperfold/