function slideshowitemPreview(path, id) {
	document.getElementById(id).innerHTML = "<img src=\"" + path + "\" alt=\"Image preview\" style=\"max-width:50px;\" />";

}

function deleteKSl(id) {
	elem = document.getElementById("sl_" + id);
	elem.parentNode.removeChild(elem);
}
function deleteNKSl(counter) {
	elem = document.getElementById("n_sl_" + counter);
	elem.parentNode.removeChild(elem);
}


var newMICounter = 0;

function newklantenslideshowitem() {
	showLoading();
	$.ajax({
		url: "modules/Omniplan_klanten/ajax/newItem.php?counter=" + newMICounter,
		success: function(data) {
			$("#sortable").append(data);
			$("#sortable").sortable({ 
				axis: 'y', 
				cursor: 'n-resize' 
			});
			$("#sortable").disableSelection();
			$("#sortable li").hover(
			  function () {
			    $(this).find('span').html('<img src=\"img/icons/arrow_inoutgrey.png\" alt=\"sort\">');
			  }, 
			  function () {
			    $(this).find('span').html('&nbsp;');
			  }
			);
			hideLoading();
		}
	});
	newMICounter++;
}

/*
function mycarousel_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();
    });
};



jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        auto: 1,
        scroll: 1,
    	wrap: 'circular',
    	initCallback: mycarousel_initCallback
    });
});

*/

$(function(){
	//Get our elements for faster access and set overlay width
	
	var div        = $('div.sc_menu');
	var ul         = $('ul.sc_menu')
	var liitems    = $('ul.sc_menu li').size();
	var ulPadding  = 0;
	
    var divWidth = div.width();
    
    ul.width(liitems*157 + liitems*2);
    div.css({overflow: 'hidden'});


    //Find last image container
	var lastLi = ul.find('li:last-child');
	
	//When user move mouse over menu
	div.mousemove(function(e){
	
		//As images are loaded ul width increases,
		//so we recalculate it each time
		var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding;
		//alert(e.pageX);
		var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth;
		div.scrollLeft(left);
		
	});
	
    div.hover(function(){
        div.stop();
    }, function() {
        Scroll(div, ul.width());
    });

	
	
	Scroll(div, ul.width());
	
	
});
function Scroll(div, width) {
    div.animate({scrollLeft: "+="+width}, 70000, 'linear', function() {
      div.animate({scrollLeft: "-="+width}, 70000, 'linear', function() {
        Scroll(div,width);
      });
  });

}