The 'cycle-before' event only fires before a transition happens. When you initialize a slideshow, there is no transition, so this even will never get called.
Also, since the 'cycle-before' event gets fired before the change of slide, optionHash.currSlide
will always be the previous slide, and since it is 0-indexed, you will be 1 behind.
To fix these issues, change your cycle-before
event to cycle-update-view
event, which gets fired after the slide has been updated, and will also be called after the cycle is initialized:
$('#slideshow').on('cycle-update-view', function (e, optionHash, slideOptionsHash, currSlideEl) {
var caption = 'Image ' + (optionHash.currSlide + 1) + ' of ' + optionHash.slideCount;
$('#caption').html(caption);
});
Here is a fiddle of it working: http://jsfiddle.net/ZY4uR/2/