Animating sliding left/right when showing/hiding in AngularJS / ngAnimate

I have 3 sections (divs) - we'll call them #section1 to #section3. When the page loads, #section1 is the only one of the three visible owing to ngShow - I have a variable visibleSection in the controller that's a value of either 1, 2 or 3 to determine which is visible.

I have a JSFiddle here that's set up with those conditions.
https://jsfiddle.net/46x01Ldm/14/

However, what I'm looking for is a way to make the sections move when you click "Next" or "Previous".

When the user clicks "Previous", I'd like the old section to slide out to the right and the new section to slide in from the left, as if the user has swiped to the right with their finger.

When the user clicks "Next", I'd like the old section to slide out to the left and the new section to slide in from the right, as if the user has swiped to the left with their finger.

How would I go about achieving this?

Thank you very much for any suggestions or assistance! I have jQuery and animate.css to work with, if that helps.