function createSlider(offset, startanimation) {
	var sliderRuntime = 0;
	
	$('.sliderContainer .sliderPics').ready(function() {
		
		var BildListe = new Array();
		var Bilder = new Array();
		var i = 0;
		$('.sliderContainer .sliderPics li img').each(function(){
			BildListe[i] = $(this).attr('src');
			i++;
		});
		i--;
		var Bild = new Image();
		Bild.src = BildListe[i];
		
		if(navigator.userAgent.indexOf("MSIE") != -1){
			renderSlider(offset, startanimation);
		} else {
			Bild.onload=function(){
				renderSlider(offset, startanimation);
			} 
		}
	});
	
	$('.buttonLeft').click(function() {
		try {
			$('div.sliderGallery ul').stop(true);
			
			var min = $('div.sliderGallery .slider').slider('option', 'min');
			$('div.sliderGallery .slider').slider('option', 'value', min);
			$('div.sliderGallery ul').animate({
                'left': '-' + min + 'px'
            }, 500, 'linear');
		} catch(e) {
			
		}
	});
	
	$('.buttonRight').click(function() {
		try {
			$('div.sliderGallery ul').stop(true);
			
			var max = $('div.sliderGallery .slider').slider('option', 'max');
			$('div.sliderGallery .slider').slider('option', 'value', max);
			$('div.sliderGallery ul').animate({
                'left': '-' + max + 'px'
            }, 500, 'linear', function() {});
		} catch(e) {
			
		}
	});
}

function renderSlider(offset, startanimation){
	$('div.sliderGallery').each(function(){
		var ul = $('ul', this);
		
		var children = ul.find('img');
		var wi = 0;
		var offsetValue = 0;
		
		sliderRuntime = children.length * 5 * 1000;
		
		for (var k = 0; k < children.length; k++) {
			wi += $(children.get(k)).width() + 60; // Margin links und rechts je 30px
			
			if (k < offset) {
				offsetValue += $(children.get(k)).width() + 60;
			}
			
			if (k == offset - 1) {
				offsetValue -= $(children.get(k)).width() + 60;
			}
			
			// Reduced sizes
			var child = $(children.get(k));
			reducedSliderImageSizes[child.attr('id')] = child.width();
		}
		
		// Events
		children.mouseover(function() {
			$('div.sliderGallery ul').stop(true);
			
			$(this).stop(true).animate({
				width : sliderImageSizes[$(this).attr('id')]
			}, 400, 'swing');
		});
		
		children.mouseout(function() {
			$(this).stop(true).animate({
				width : reducedSliderImageSizes[$(this).attr('id')]
			}, 400, 'swing');
		});
		
		// Handle
		$('div.sliderGallery .sliderWrapperInner').mouseover(function() {
			$('div.sliderGallery ul').stop(true);
		});
		
        var productWidth = wi - $(this).outerWidth();
		
		if (wi > 974) {
		
			slider = $('.slider', this).slider({
				min: 0,
				max: productWidth,
				slide: function(ev, ui){
					ul.css('left', '-' + ui.value + 'px');
				},
				stop: function(ev, ui){
					ul.animate({
						'left': '-' + ui.value + 'px'
					}, 500, 'linear');
				}
			});
			
			if (offsetValue > 0) {
				if (offsetValue > productWidth) offsetValue = productWidth;
				ul.css('left', '-' + offsetValue + 'px');
				slider.slider('option', 'value', offsetValue);
			}
		} else {
			sliderRuntime = 0;
		}
		
		// Calculate span margins
		var spans = $('.slider .spanContainer span', this);
		var numSpans = spans.size();
		
		var width = '';

		var totalWidth = 0;
		var minPadding = 20;
		
		for (var i=0; i<numSpans; i++) {
			totalWidth += spans[i].offsetWidth;
		}
		
		if ((900 - totalWidth) / (2 * numSpans) >= minPadding) {
			spans.css('padding-left', (900 - totalWidth) / (2 * numSpans));
			spans.css('padding-right', (900 - totalWidth) / ( 2 * numSpans));
		}
		else {
			spans.css('padding-left', minPadding);
			spans.css('padding-right', minPadding);
			// Add slider functionality	
		}

	});
	
		// Start slider animation
	try {
		if (startanimation && sliderRuntime > 0) {
			var max = $('div.sliderGallery .slider').slider('option', 'max');

			$('div.sliderGallery ul').animate({
	            'left': '-' + max + 'px'
	        },
	        {
	        	duration : sliderRuntime,
	        	step: function(newLeftValue) {
	        		$('div.sliderGallery .slider').slider('option', 'value', Math.abs(parseInt(newLeftValue)));
	        	},
	        	easing: 'linear'
	        });
		}
	} catch(e) {
		
	}
}

