.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:
  2.   .sidebar {
  3.     position: relative;
  4.   }

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

  12.   .sidebar-unstuck {
  13.     bottom: 22px;
  14.     position: absolute;
  15.     top: auto;
  16. }
Here's my JS:
  2.       var unstickSidebar = new Waypoint.Inview({
  3.         element: $('section.related')[0],
  4.         enter: function(direction) {
  5.           if (direction === 'down') {
  6.             $('.sidebar-sticky').switchClass('sidebar-stuck','sidebar-unstuck');
  7.           }
  8.         },
  9.         exited: function(direction) {
  10.           if (direction === 'up') {
  11.             $('.sidebar-sticky').switchClass('sidebar-unstuck','sidebar-stuck');
  12.           }
  13.         }
  14.       });
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?