<!--
var redaxo = true;
var actualImage = '#big_image_1';	
var automatic_image_change = true;
var next_minibox_change_possible = true;


// jQuery is now removed from the $ namespace
// to use the $ shorthand, use (function($){ ... })(jQuery);
// and for the onload handler: jQuery(function($){ ... });
jQuery.noConflict();


// Eigene Funktionen
jQuery(function() {
	
	jQuery("#image_changer_1 .number").css('font-weight', 'bold');	
	
	// eigene Hilfsfunktion zum Bilderwechseln
	jQuery.fn.bildwechsel = function(actualImage, newImage){
	if( actualImage != newImage )
	{
		
//		alert(actualImage+" - "+ newImage);

		// Hier muss mit den verschiedenen Ebene hantiert werden, da die Bilder ja alle uebereinander liegen
		// das aktuelle Bild muss dabei noch oben gelegt werden und das neue da drunter
		// dann wird das aktuelle Bild ausgeblendet und zusaetzlich danach noch "unter" das neue Bild gelegt (z-index = 5)
		jQuery(actualImage).css('z-index',15);
		jQuery(newImage).css('z-index',10);
		
		jQuery(actualImage).show();	
		jQuery(newImage).show();	

		jQuery(actualImage).fadeOut(1000);

		// Zeitverzoegerung, damit fadeOut(9 erst vollstaendig erledigt ist bevor er weiter geht
		setTimeout ( function() { 
			jQuery(actualImage).css('z-index',5);
		}, 1000 );		
	}
	return newImage;	
}


	// automatischer Bilderwechsel nach 5 Sekunden
	setTimeout ( function() { 
		if( automatic_image_change ) { 
		actualImage = jQuery("#big_image_2").bildwechsel(actualImage, "#big_image_2"); 
		jQuery("#image_changer_1 .number").css('font-weight', 'normal');
		jQuery("#image_changer_2 .number").css('font-weight', 'bold');
		jQuery("#image_changer_3 .number").css('font-weight', 'normal');
		}
	}, 5000 );		
	setTimeout ( function() { 
		if( automatic_image_change ) { 
		actualImage = jQuery("#big_image_3").bildwechsel(actualImage, "#big_image_3"); 
		jQuery("#image_changer_1 .number").css('font-weight', 'normal');
		jQuery("#image_changer_2 .number").css('font-weight', 'normal');
		jQuery("#image_changer_3 .number").css('font-weight', 'bold');
		}
	}, 10000 );		


	jQuery("#image_changer_1").click(function() {
	    automatic_image_change = false;
		actualImage = jQuery("#big_image_1").bildwechsel(actualImage, "#big_image_1");
		jQuery("#image_changer_1 .number").css('font-weight', 'bold');
		jQuery("#image_changer_2 .number").css('font-weight', 'normal');
		jQuery("#image_changer_3 .number").css('font-weight', 'normal');		
		return false;		
	});
	jQuery("#image_changer_2").click(function() {
	    automatic_image_change = false;
		actualImage = jQuery("#big_image_2").bildwechsel(actualImage, "#big_image_2");
		jQuery("#image_changer_1 .number").css('font-weight', 'normal');
		jQuery("#image_changer_2 .number").css('font-weight', 'bold');
		jQuery("#image_changer_3 .number").css('font-weight', 'normal');			
		return false;		
	});	
	jQuery("#image_changer_3").click(function() {
	    automatic_image_change = false;
		actualImage = jQuery("#big_image_3").bildwechsel(actualImage, "#big_image_3");
		jQuery("#image_changer_1 .number").css('font-weight', 'normal');
		jQuery("#image_changer_2 .number").css('font-weight', 'normal');
		jQuery("#image_changer_3 .number").css('font-weight', 'bold');			
		return false;		
	});		
		

	jQuery("#image_changer_1").mouseover(function() { jQuery('#image_changer_1 span.hoverText').show(); return false; });
	jQuery("#image_changer_1").mouseout(function() { jQuery('#image_changer_1 span.hoverText').hide(); return false; });
	jQuery("#image_changer_2").mouseover(function() { jQuery('#image_changer_2 span.hoverText').show(); return false; });
	jQuery("#image_changer_2").mouseout(function() { jQuery('#image_changer_2 span.hoverText').hide(); return false; });
	jQuery("#image_changer_3").mouseover(function() { jQuery('#image_changer_3 span.hoverText').show(); return false; });
	jQuery("#image_changer_3").mouseout(function() { jQuery('#image_changer_3 span.hoverText').hide(); return false; });


// ab hier folgen die Effekte fuer die kleinen Bilder

// Box Nr. 1 ---------------------------------------------------
jQuery('#small_image_1').hover(function(){
//	jQuery(this).css('z-index', '90'); 
    jQuery('#small_image_1').stop(true, false).animate({ top: "0px", left: "48px", width: "360px", height: "204px" }, 500);
    jQuery('#small_image_2').stop(true, false).animate({ top: "60px", left: "432px", width: "124px", height: "144px" }, 500);
    jQuery('#small_image_3').stop(true, false).animate({ top: "60px", left: "580px", width: "124px", height: "144px" }, 500);
    jQuery('#small_image_4').stop(true, false).animate({ top: "60px", left: "724px", width: "124px", height: "144px" }, 500);
}, function() {
    jQuery('#small_image_1').stop(true, false).animate({ top: "60px", left: "48px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_2').stop(true, false).animate({ top: "60px", left: "261px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_3').stop(true, false).animate({ top: "60px", left: "474px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_4').stop(true, false).animate({ top: "60px", left: "687px", width: "165px", height: "144px" }, 300);
});


// Box Nr. 2 ---------------------------------------------------
jQuery('#small_image_2').hover(function(){
    jQuery('#small_image_1').stop(true, false).animate({ top: "60px", left: "48px", width: "124px", height: "144px" }, 500);
    jQuery('#small_image_2').stop(true, false).animate({ top: "0px", left: "196px", width: "360px", height: "204px" }, 500);
    jQuery('#small_image_3').stop(true, false).animate({ top: "60px", left: "580px", width: "124px", height: "144px" }, 500);
    jQuery('#small_image_4').stop(true, false).animate({ top: "60px", left: "724px", width: "124px", height: "144px" }, 500);
}, function() {
	// Original-Positionen (Kopie von #small_image_1)
    jQuery('#small_image_1').stop(true, false).animate({ top: "60px", left: "48px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_2').stop(true, false).animate({ top: "60px", left: "261px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_3').stop(true, false).animate({ top: "60px", left: "474px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_4').stop(true, false).animate({ top: "60px", left: "687px", width: "165px", height: "144px" }, 300);
});


// Box Nr. 3 ---------------------------------------------------
jQuery('#small_image_3').hover(function(){
    jQuery('#small_image_1').stop(true, false).animate({ top: "60px", left: "48px", width: "124px", height: "144px" }, 500);
    jQuery('#small_image_2').stop(true, false).animate({ top: "60px", left: "196px", width: "124px", height: "144px" }, 500);
    jQuery('#small_image_3').stop(true, false).animate({ top: "0px", left: "344px", width: "360px", height: "204px" }, 500);
    jQuery('#small_image_4').stop(true, false).animate({ top: "60px", left: "724px", width: "124px", height: "144px" }, 500);
}, function() {
	// Original-Positionen (Kopie von #small_image_1)
    jQuery('#small_image_1').stop(true, false).animate({ top: "60px", left: "48px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_2').stop(true, false).animate({ top: "60px", left: "261px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_3').stop(true, false).animate({ top: "60px", left: "474px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_4').stop(true, false).animate({ top: "60px", left: "687px", width: "165px", height: "144px" }, 300);
});


// Box Nr. 4 ---------------------------------------------------
jQuery('#small_image_4').hover(function(){
    jQuery('#small_image_1').stop(true, false).animate({ top: "60px", left: "48px", width: "124px", height: "144px" }, 500);
    jQuery('#small_image_2').stop(true, false).animate({ top: "60px", left: "196px", width: "124px", height: "144px" }, 500);
    jQuery('#small_image_3').stop(true, false).animate({ top: "60px", left: "344px", width: "124px", height: "144px" }, 500);
    jQuery('#small_image_4').stop(true, false).animate({ top: "0px", left: "492px", width: "360px", height: "204px" }, 500);
}, function() {
	// Original-Positionen (Kopie von #small_image_1)
    jQuery('#small_image_1').stop(true, false).animate({ top: "60px", left: "48px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_2').stop(true, false).animate({ top: "60px", left: "261px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_3').stop(true, false).animate({ top: "60px", left: "474px", width: "165px", height: "144px" }, 300);
    jQuery('#small_image_4').stop(true, false).animate({ top: "60px", left: "687px", width: "165px", height: "144px" }, 300);
});


});	


//-->