jquery - jquery cycle pager and before and after functions

Question

I know how to make a jquery cycle with a pager or a cycle with before and after functions. when I have both though, it removes the pager. is there anyway I can get around this. do I have to recreate the pager myself or something, or is there a better way

can I call the super before and after functions maybe? thank you

(I want to add the commented code)

 $LAB.script('/sesame_scripts/scripts/jquery.cycle.2.73.all.min.js')
        .wait(function() {


            var $firstSlide = $slideshowContainer.find('img'),
                width = $firstSlide.attr('width'),
                height = $firstSlide.attr('height'),
                slideItems = '';

            // add slides to slideshow (images 1-4)
            for (var i = 1; i <= 4; i++) {
                slideItems += '<img src="/assets/images/slideshow/slide'+i+'.jpg" alt="slide" width="'+width+'" height="'+height+'" />';
            }

            $slideshowContainer.append(slideItems);

            // start the slideshow 
            $('.slideshow img:first').fadeIn(1000, function() {
                $slideshowContainer.cycle({
                    fx:    'fade',
                    pause: false,
                    wmode: 'transparent',
                    height: height,
                    cleartype: false, // true if clearType corrections should be applied (for IE)
                    cleartypeNoBg: true, // Set to true to disable extra cleartype fixing (leave false to force background color setting on slides)
                    speed: 1000, // This controls speed of transition
                    timeout: 7000, // This controls delay between slides. Set to 0 if more than one office tour on a page, so they don't auto-play
                    pager: '#slide-pager',
                    /*before: function(){
                        //$('.slideA').css('display', 'none');
                    },
                    after: function() {
                        if(opts.slideCount == 1){
                            $('#slide1a').css('display', 'block');
                            $('#slide1n').css('display', 'block');

                        }else if(opts.slideCount == 3){
                            $('#slide3').css('display', 'block');

                        }else if(opts.slideCount == 4){
                            $('#slide4').css('display', 'block');
                        }
                    }*/
                });
            });
    });