CSS3 преобразования во вращение «на» п степени

Question

у меня есть куб (ну почти), составленные из 4-див, который я вращающиеся с помощью CSS3 преобразований (в настоящее время ограничивается -webkit, как это для расширения Chrome.)

Однако вы увидите, что если вы перейдете к http://jsfiddle.net/CxYTg/ и нажмите «один», «два», «три», «четыре», а затем снова на «один», последнее вращение идет в обратном направлении для возврата назад к первоначальной ориентации.

Есть ли способ исправить это с помощью CSS3? Я интересно, если есть способ сделать что-то вроде:

#environment li.rota180:first-of-type .cubeface { -webkit-transform: rotateY("by 90deg") translate3d(0, 0, 100px); } 

(И да, я знаю, что я мог бы просто сделать это с помощью JavaScript - но я хотел бы узнать, если это возможно, чтобы сделать это с помощью CSS только.)

Answer 1

Нет никакого способа сделать это с чистым css.
Для реализации этого, как вы хотели, вам нужны переменные и условия, использовать javascript проще.
Все, что вам нужно сделать, это создать две переменные для градусов и одну для запоминания текущего окна. Остальные - это просто условия.