I utilized this particular inquiry to develop a cube controller.
Here's my progress so far.
To initiate the animation, I am employing ng-if
and ng-include
.
<div ng-repeat='view in views' class='cube container'>
<div ng-if='view.name == selected' " +
ng-include='view.template' " +
ng-animate="{enter: 'animate-enter',
leave: 'animate-leave'}">
</div>
</div>
I have a couple of inquiries:
When transitioning from panel 1 to panel 3, it should pass through panel 2. Despite setting a sequence that switches the selected panel to #2 before moving to #3, the animation proceeds directly to #3. Is there a method to hold off until the transition to #2 is complete before advancing to #3?
I'm encountering difficulty in maintaining a fixed size for the cube controller. If you introduce an additional
cube-viewer
in the provided example, you will notice overlapping occurrences.
My objective is to achieve a solution solely through CSS (excluding keyframes or JavaScript/jQuery animations).
Thank you.