My modal includes a next button for easy navigation.
Initially, the modal showcases content within:
<div ng-show="step1"></div>Upon clicking the next button, the modal transitions to display different contents in 'step2' within the same modal.
The overall modal structure appears like this:
<div class="modal-body">
<div ng-show="step1">
This is step 1
</div>
<div ng-show="step2">
This is step 2
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" ng-click="next()" ng-show="step1">Next</button>
<button class="btn btn-primary" ng-click="prev()" ng-show="step2">Previous</button>
</div>
I am looking to add some transition effects when the user clicks on the next button to provide a smoother switch between step contents. Any guidance on how to accomplish this would be greatly appreciated.
Plnkr available here: http://plnkr.co/edit/eWy6XA1U4GCWr1cK22hH