jquery carousel: jcarousel

<script type="text/javascript">
/**
* We use the initCallback callback
* to assign functionality to the controls
*/
function mycarousel_initCallback(carousel) {
  jQuery('.jcarousel-control a').bind('click', function() {
    carousel.scroll(jQuery.jcarousel.intval(jQuery(this).attr("rel")));
    carousel.startAuto(0);
    return false;
  });
  
  jQuery('.jcarousel-control a').css({ opacity: 0.5 });
  jQuery('.jcarousel-control a').hover(
    function(){ 
      $(this).css({opacity: 1})
    },
    function(){
      if($(this).hasClass('on')){
        $(this).css({opacity: 1});
      }
      else{
        $(this).css({opacity:0.5});
      }
    }
  );


  jQuery('#carousel-next').bind('click', function() {
    carousel.next();
    carousel.startAuto(0);
    return false;
  });

  jQuery('#carousel-prev').bind('click', function() {
    carousel.prev();
    carousel.startAuto(0);
    return false;
  });

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

function mycarousel_itemVisibleCallback(carousel, item, idx, state) {
  jQuery('.jcarousel-control a').removeClass('on').addClass('off').css({ opacity: 0.5 });
  jQuery('#jcarousel_' + idx).removeClass('off').addClass('on').css({ opacity: 1 });
}

jQuery(document).ready(function() {
  jQuery(".jcarousel-content").jcarousel({
    scroll: 1,
    auto: 8,
    wrap: 'both',
    initCallback: mycarousel_initCallback,
    itemVisibleInCallback: mycarousel_itemVisibleCallback,
    // This tells jCarousel NOT to autobuild prev/next buttons
    buttonNextHTML: null,
    buttonPrevHTML: null
  });
});

</script>