jQuery(document).ready(function($)
{
	var rand_slide = false; //pick a new initial slide each load
	var slides = $('#slides img');

    $('#mycarousel').jcarousel({
		scroll: 1, //# of slides to flip each time
		auto: 15, //seconds before flipping
        wrap: 'last', //auto rewind to beginning
        buttonNextHTML: null, //no next button
        buttonPrevHTML: null, //no prev button
		animation: 0, //no transition animation
		start: ( rand_slide ? Math.floor(Math.random() * slides.length + 1) : 1 ),

		itemVisibleInCallback: { onBeforeAnimation: function(carousel, item, i, state, evt)
		{	//highlight the mini slide this big slide is on
			slides.removeClass('showing');
			$('#slide-' + i).addClass('showing');
		} },

		initCallback: function(carousel)
		{
			slides.hover(function()
			{	//jump to the slide you hover on
				carousel.scroll(parseInt(this.id.substr(6))); //images in slides div with id's like slide-X
			}, null);
		}
    });
});