I'm having issues with the animations when I try to use the jquery plugin "roundabout" (http://fredhq.com/projects/roundabout/) with an AngularJS application. I've written a directive for it:
carousel: [function() { return {
link: function($scope, $elem, $attrs) {
$($elem).roundabout()
}
}}],
and the html looks like:
<ul carousel="{}">
<li>Test</li>
<li>Another Test</li>
<li>Three Test</li>
<li>Four Test</li>
<li>Five Test</li>
</ul>
When I run the application, I see the carousel activate, which isn't a problem, so I know the directive seems to work. The issue is the animation. Clicking one of them should provide a smooth rotating animation, but instead it moves slowly to the right for about a second (only a few pixels) (doesn't matter if it should be turning right or left) then jumps to the new position. Is there a way to get it to work with Angular, or something obvious I'm missing? I've looked into ng-animate, but I don't think I can use it in this case, considering that the plugin is handling the animations.