function hdfCarousel_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();
    });
};

//HDFLandscape
jQuery(document).ready(function() {

    var hdfArray = $('#hdf li');

    var itemVisibleInCallback = function(carousel, item, i, state, evt) {
        // The index() method calculates the index from a
        // given index who is out of the actual item range.
        var idx = carousel.index(i, hdfArray.length);
        carousel.add(i, hdfArray.eq(idx - 1).html());
    };

    var itemVisibleOutCallback = function(carousel, item, i, state, evt) {
        carousel.remove(i);
    };

    jQuery('#hdf').jcarousel({
        auto: 6,
        wrap: 'circular',
        animation: 'slow',
        scroll: 1,
        initCallback: hdfCarousel_initCallback,
        itemVisibleInCallback: { onBeforeAnimation: itemVisibleInCallback },
        itemVisibleOutCallback: { onAfterAnimation: itemVisibleOutCallback }
    });
});

//HDFPortrait
jQuery(document).ready(function() {
    var hotArray = $('#hdf-hot li');

    var itemVisibleInCallback = function(carousel, item, i, state, evt) {
        var idx = carousel.index(i, hotArray.length);
        carousel.add(i, hotArray.eq(idx - 1).html());
    };

    var itemVisibleOutCallback = function(carousel, item, i, state, evt) {
        carousel.remove(i);
    };

    jQuery('#hdf-hot').jcarousel({
        auto: 7,
        wrap: 'circular',
        animation: 'slow',
        scroll: 1,
        initCallback: hdfCarousel_initCallback,
        itemVisibleInCallback: { onBeforeAnimation: itemVisibleInCallback },
        itemVisibleOutCallback: { onAfterAnimation: itemVisibleOutCallback }

    });

});



jQuery(document).ready(function() {
    var featureArray = $('#hdf-feature li');

    var itemVisibleInCallback = function(carousel, item, i, state, evt) {
        var idx = carousel.index(i, featureArray.length);
        carousel.add(i, featureArray.eq(idx - 1).html());
    };

    var itemVisibleOutCallback = function(carousel, item, i, state, evt) {
        carousel.remove(i);
    };
    
    jQuery('#hdf-feature').jcarousel({
        auto: 7,
        wrap: 'circular',
        animation: 'slow',
        scroll: 1,
        initCallback: hdfCarousel_initCallback,
        itemVisibleInCallback: { onBeforeAnimation: itemVisibleInCallback },
        itemVisibleOutCallback: { onAfterAnimation: itemVisibleOutCallback }
    });
    
});