It already supports fading in and out with CSS animations. I was thinking of adding slide up/down animations, but am not sure of a good way to implement this.

Use CSS transforms. Unlike absolute positioning, percentages with a transform bases the resulting value off the transformed element's size. So something like this:

  figure figurecaption { 
    transition: all 0.4s;
    transform: translateY(100%);
  }
  figure:hover figurecaption { transform: none; }

Will get you the effect you want.