var index=0;
var title = new Array('Title 1', "Title 2");
var prev_el = null;

function mycarousel_initCallback(carousel) {

$('#carousel li').hover(
	function() {
		$(this).children('img.title').clearQueue().fadeIn();
		$(this).children('img').clearQueue().animate({opacity: 1});
	},
	function() {
		var el = $(this).children('img.description');
		if($(el).css('display') == 'none') {
			$(this).children('img.title').clearQueue().fadeOut();
			$(this).children('img').animate({opacity: 0.5});
		}
	}	
);

$('#carousel li').click(
	function(event) {
		if(event.target.nodeName == 'AREA')
			return;
		var el = $(this).children('img.description');
		if(prev_el != null && prev_el != $(this)) {
			var tmp = $(prev_el).children('img.description');
			$(prev_el).children('img.title').fadeOut();
			$(tmp).fadeOut();
			$(prev_el).children('img').animate({opacity: 0.5});
		}
		prev_el = $(this);
		if($(el).css('display') == 'none') {
			$(this).children('img.title').fadeIn();
			$(el).fadeIn();
		} else {
			$(this).children('img.title').fadeOut();
			$(el).fadeOut();
			$(this).children('img').animate({opacity: 0.5});
		}
	}
	
);

$('#carousel-next').bind('click', function() {
		$('#carousel-prev').removeClass('disabled');
        carousel.next();
		if(index < title.length-1)
			index++;
		if(index == title.length-1) {
			$(this).addClass('disabled');
		}
        return false;
    });

    $('#carousel-prev').bind('click', function() {
		$('#carousel-next').removeClass('disabled');
        carousel.prev();
		if(index > 0)
			index--;
		if(index == 0)
			$(this).addClass('disabled');
        return false;
    });

};




$(document).ready(function() {
    $('#carousel').jcarousel({
        // Configuration goes here
		scroll: 4,
		initCallback: mycarousel_initCallback,
		
	    // This tells jCarousel NOT to autobuild prev/next buttons
	    buttonNextHTML: null,
	    buttonPrevHTML: null
	 
    });
});