.switchClass() animating undeclared properties

.switchClass() animating undeclared properties

I'm using waypoints.js to trigger a sticky sidebar and disable it once a specific div scrolls into view. From my CSS below, you'll see it only switches the bottom, position, and top properties. If I use .removeClass()/.addClass() the positioning is correct, but nothing seems to get animated and there's a jerky jump when the positioning changes. If I use .switchClass(), instead of just a jerky jump, the sticky sidebar moves diagonally away from its container and reappears in position, and the animation changes the left, right, and z-index style properties.

Here's my CSS:
  1.   .sidebar {
  2.     position: relative;
  3.   }

  4.   .sidebar-stuck {
  5.     bottom: auto;
  6.     position: fixed;
  7.     top: 65px;
  8.   }

  9.   .sidebar-unstuck {
  10.     bottom: 22px;
  11.     position: absolute;
  12.     top: auto;
  13. }
Here's my JS:
  1.       var unstickSidebar = new Waypoint.Inview({
  2.         element: $('section.related')[0],
  3.         enter: function(direction) {
  4.           if (direction === 'down') {
  5.             $('.sidebar-sticky').switchClass('sidebar-stuck','sidebar-unstuck');
  6.           }
  7.         },
  8.         exited: function(direction) {
  9.           if (direction === 'up') {
  10.             $('.sidebar-sticky').switchClass('sidebar-unstuck','sidebar-stuck');
  11.           }
  12.         }
  13.       });
Is there a way to prevent .switchClass() from altering properties that aren't in use by my classes, or at least, can you think of a better way to do what I'm trying to do, so that my sidebar stays where it's supposed to?