var $jq = jQuery.noConflict();

function carousel_initCallback(carousel) {
    // Disable autoscrolling if the user clicks the prev or next button.
    carousel.buttonNext.bind('click', function () {
        carousel.startAuto(0);
    });

    carousel.buttonPrev.bind('click', function () {
        carousel.startAuto(0);
    });

    // Pause autoscrolling if the user moves with the cursor over the clip.
    carousel.clip.hover(function () {
        carousel.stopAuto();
    }, function () {
        carousel.startAuto();
    });
};

$jq(document).ready(function () {
    $jq('#carousel').jcarousel({
        scroll: 1,
        auto: 0,
        wrap: 'last',
        initCallback: carousel_initCallback,
        itemLoadCallback: trigger,
        buttonNextHTML: '<div id="btnNext">Next</div>',
        buttonPrevHTML: '<div id="btnPrev">Previous</div>'
    });

    //Count the number of items in the <ul>
    var carouselitemcount = 0;

    $jq(".carouselitem").each(function(index) {
    	carouselitemcount++;
 });

 $jq("#jcarousel-control .item-length").html(carouselitemcount);


});

    function trigger(carousel, state) {
        $jq("#jcarousel-control .current-item").html(carousel.first + ' of');
}