Need help using Nivo Slider beforeChange and afterChange functions for fade effects on custom caption div

I'm trying to use a custom div structure for displaying captions on Nivo Slider and I'm having trouble with using the fade in and out effects on the caption text itself. I'm calling post titles and content from a custom post type within a div I've called #customcaption, and the actual text is called within a div called .captiontext within the previous div.

Everything displays as it should, but I can't quite get the fade in and out to work the way it does when you call the caption from the HTML title attribute. I've used the following beforeChange and afterChange functions to try and achieve this, but it's not quite working:

beforeChange: function(){
    $('.captiontext').fadeOut(500);
}, 

afterChange: function(){
    $('.captiontext').fadeIn(500);
}, 

I would also like it to match the animation speed like it does by default when calling the caption from the HTML title. I'm very new to Nivo开发者_StackOverflow Slider so I'm a bit of a n00b, any help would be greatly appreciated.

Have you tried using animate instead of fadeIn / fadeOut? Animate the opacity down and back up instead, and just use the same speed that you set for Nivo Slider.