//m_ achtung: 
$(document).ready(function() {
  jQuery.easing.def = 'easeOutQuad';
	var sel1 = $("<select>").appendTo('#controls');
	for (x in jQuery.easing)
	{
		if (x != 'linear' && x != 'swing')
			sel1.append($('<option>').attr('value', x).text(x));
	}
	sel2 = sel1.clone().appendTo('#controls');
	sel1.val('easeInQuad');
	sel2.val('easeOutQuad');
	
	
	
	
//m_ alle auf 1. Position 0		
	$(".a_01").click(function(e){					//m_ funktion an klasse gebunden
		e.preventDefault();
		this.blur();
		// var el = $('#' + this.href.split('#')[1]);
		var method1 = sel1.val();
		var method2 = sel2.val();
		$('#visual_move').animate({				// bewegt visual auf 0
			left:0
			}, 
			{
			duration: 1000, 
			easing: method1
				})		
													
		$('#overlay_move').animate({					//m bewegt overlay auf 0
			top:0
			}, 
			{
			duration: 1000, 
			easing: method1
				})
		$('#buttons_move').animate({					//m bewegt button auf 0
			left:0
			}, 
			{
			duration: 500, 							// schneller als der rest, da kleinerer abstand
			easing: method1
				})
		
	});	
	
	
//m_ 	bewegung auf 2. position		
	$(".a_02").click(function(e){			//m_ funktion an klasse gebunden
		e.preventDefault();
		this.blur();
		// var el = $('#' + this.href.split('#')[1]);
		var method1 = sel1.val();
		var method2 = sel2.val();
		$('#visual_move').animate({				//m bewegt overlay auf -980, also ein bild nach links
			left:-980
			}, 
			{
			duration: 1000, 
			easing: method1
				})		
											  
		$('#overlay_move').animate({				
			top:-365							// 400-35px oben
			}, 
			{
			duration: 1000, 
			easing: method1
				})
		$('#buttons_move').animate({					//m 2. position: 1x 12 nach rechts
			left:12
			}, 
			{
			duration: 500, 
			easing: method1
				})
	});

// bewegung auf 3. position
$(".a_03").click(function(e){			//m_ funktion an klasse gebunden
		e.preventDefault();
		this.blur();
		// var el = $('#' + this.href.split('#')[1]);
		var method1 = sel1.val();
		var method2 = sel2.val();
		$('#visual_move').animate({				//m 3.position: 2 x 980 nach links
			left:-1960
			}, 
			{
			duration: 1000, 
			easing: method1
				})		
											  
		$('#overlay_move').animate({				
			top:-730							// 3. position: 2mal 365 oben
			}, 
			{
			duration: 1000, 
			easing: method1
				})
		$('#buttons_move').animate({					//m 3. position: 2mal 12px nach rechts
			left:24
			}, 
			{
			duration: 500, 
			easing: method1
				})
	});

// bewegung auf 4. position
$(".a_04").click(function(e){			//m_ funktion an klasse gebunden
		e.preventDefault();
		this.blur();
		// var el = $('#' + this.href.split('#')[1]);
		var method1 = sel1.val();
		var method2 = sel2.val();
		$('#visual_move').animate({				//m 4.position: 3x 980  nach links
			left:-2940
			}, 
			{
			duration: 1000, 
			easing: method1
				})		
											  
		$('#overlay_move').animate({				
			top:-1095							// 4. position: 3x 365
			}, 
			{
			duration: 1000, 
			easing: method1
				})
		$('#buttons_move').animate({					//m 4. position: 3mal 12px nach rechts
			left:36
			}, 
			{
			duration: 500, 
			easing: method1
				})
	});

// bewegung auf 5. position
$(".a_05").click(function(e){			//m_ funktion an klasse gebunden
		e.preventDefault();
		this.blur();
		// var el = $('#' + this.href.split('#')[1]);
		var method1 = sel1.val();
		var method2 = sel2.val();
		$('#visual_move').animate({				//m_ 5.position: 4x 980 nach links
			left:-3920
			}, 
			{
			duration: 1000, 
			easing: method1
				})		
											  
		$('#overlay_move').animate({				
			top:-1460					//m_ 5. position: 4x 365
			}, 
			{
			duration: 1000, 
			easing: method1
				})
		$('#buttons_move').animate({					//m_ 5. position: 4mal 12px nach rechts
			left:48
			}, 
			{
			duration: 500, 
			easing: method1
				})
	});

// bewegung auf 6. position
$(".a_06").click(function(e){			//m_ funktion an klasse gebunden
		e.preventDefault();
		this.blur();
		// var el = $('#' + this.href.split('#')[1]);
		var method1 = sel1.val();
		var method2 = sel2.val();
		$('#visual_move').animate({				//m_ 6.position: 5x 980 nach links
			left:-4900
			}, 
			{
			duration: 1000, 
			easing: method1
				})		
											  
		$('#overlay_move').animate({				
			top:-1825						//m_ 6. position: 5x 365
			}, 
			{
			duration: 1000, 
			easing: method1
				})
		$('#buttons_move').animate({					//m_ 6. position: 5mal 12px nach rechts
			left:60
			}, 
			{
			duration: 500, 
			easing: method1
				})
	});

// bewegung auf 7. position
$(".a_07").click(function(e){			//m_ funktion an klasse gebunden
		e.preventDefault();
		this.blur();
		// var el = $('#' + this.href.split('#')[1]);
		var method1 = sel1.val();
		var method2 = sel2.val();
		$('#visual_move').animate({				//m_ 7.position: 6x 980 nach links
			left:-5880
			}, 
			{
			duration: 1000, 
			easing: method1
				})		
											  
		$('#overlay_move').animate({				
			top:-2190				//m_ 
			}, 
			{
			duration: 1000, 
			easing: method1
				})
		$('#buttons_move').animate({					//m_ 7. position: 6mal 12px nach rechts
			left:72
			}, 
			{
			duration: 500, 
			easing: method1
				})
	});



	

	
	


//m_  werden die moentan Ÿbehaupt gebraucht	??
	$("#navl_01open").click(function() {
		$("#navhidden").hide("");
		$("#navvisible").show("");
	});


	$("#navl_01close").click(function() {
		$("#navhidden").show("");
		$("#navvisible").hide("");
	});
		
});