// JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY
// JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY
// Beginn


$(document).ready(function() { 


$("#content").fadeIn(1500);


// ----------------------------------------------------------------------------------------------------
// Navigation --> MOUSEDOWN ausgrauen der NavElemente

$('#slide-nav > li > a').mousedown(function()	{
	$(this).css('background', '#444444' )
	.animate({
		opacity: 0.3,
	}, 400);
});

// Wiederherstellen des Urzustandes
$('#slide-nav > li > a').mouseup(function()	{
	$(this).css('background', '')
	.animate({
		opacity: 1,
	}, 200);
});

// ----------------------------------------------------------------------------------------------------
// Erstellen der Bilder für Galerie
	var current_picture = 0, max_picture = 6;
	
	title = new Array("Internetseiten und Webdesign", "Drucksachen und Gestaltung", "Multimedia, Werbung, Video und Ton", "Flyer, Folder, Plakate", "Print und NON-Print");
	
	for(var i = 0; i <= max_picture; i++)	{
		$('<img />',	{
		src: 	"images_site/head_BILD_00"+i+".jpg",
		alt: 	"ZIMMER 17 DESIGN - Internetseiten, Webdesign, Drucksachen, Multimediale Werbung und mehr",
		title: 	"ZIMMER 17 DESIGN: "+title[i]+" : www.zimmer17.com"
		})
		.hide()
		.appendTo('.fader');
	}
			
// Erstes Bild zeigen
	$('.fader img').eq(0).show();
			
// Automation des Bilderwechsels
	var nextpic = function ()	{ 
		var next_picture = current_picture + 1;
	
		if(next_picture > max_picture)	{
			next_picture = 0;
		}
				
		$('.fader img').eq(current_picture).fadeOut(7000);
		$('.fader img').eq(next_picture).fadeIn(7000);
				
		if(current_picture == max_picture)	{
			current_picture = 0;
		} else	{
			current_picture++;
		}
	
		window.setTimeout(nextpic, 15000);
	}
	
	window.setTimeout(nextpic, 10000);
	
// ----------------------------------------------------------------------------------------------------		


// ----------------------------------------------------------------------------------------------------
// Navigationselemente slideOUT - slideIN
	
slide("#slide-nav", 35, 15);	
	
function slide(navigation_id, pad_out, pad_in)
{
// Erstellen der Zielpfade
	var listen_elemente = navigation_id + " li.slidemenu";
	var link_elemente = listen_elemente + " a";
	
// Slideanimation der Navigationselemente
	$(listen_elemente).each(function()	{	
	$(this).css("margin-left","0px")
		.animate({ marginLeft: "0", marginTop: "0" }, 'fast')
		.animate({ marginLeft: "0px", marginTop: "2" }, 'fast')
		.animate({ marginLeft: "0", marginTop: "0" }, 'fast');
	});

// Slideanimation bei MouseOVER
	$(link_elemente).each(function(i)	{
		$(this).hover(
			function()	{
				$(this).animate({ paddingLeft: pad_out }, 150);
			},		
			function()	{
				$(this).animate({ paddingLeft: pad_in }, 150);
			}
		);
	});	
}
// ----------------------------------------------------------------------------------------------------





// ----------------------------------------------------------------------------------------------------
// ICON slideOUT - slideIN

// ----------------------------------------------------------------------------------------------------		
});




// Ende
// JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY
// JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY JQUERY