var unterMenue = 0;

  	
  function ImTransparenz(bilder, Wert) {
	var im = document.getElementById('jgal').getElementsByTagName('li');
	for (i=0; i<bilder.length; i++) {
    			 im[bilder[i]].style.MozOpacity = Wert;
					 im[bilder[i]].style.KhtmlOpacity= Wert;
					 im[bilder[i]].style.opacity= Wert;
					 
					 IEwert=Wert*100;
					 im[bilder[i]].style.filter = "alpha(opacity=" + IEwert + ")";
  }
}
	
	function MouseOver() {
						
						this.style.filter = "alpha(opacity='50')";
						this.style.KhtmlOpacity=0.5;
						this.style.MozOpacity =0.5;
						this.style.opacity=0.5;						
	} 
	
	
	function MouseOut() {
						 if(this.className != 'active'){
						this.style.filter = "alpha(opacity='100')";
						this.style.KhtmlOpacity=1;
						this.style.MozOpacity = 1;
						this.style.opacity=1;
						}					
	}	

	
{
	function Clicken() {

							 					    
                var im = document.getElementById('jgal').getElementsByTagName('li');
								<!-- alert(this.className); -->
  						this.style.filter = "alpha(opacity='100')";
  						this.style.KhtmlOpacity=1;
  						this.style.MozOpacity =1;
  						this.style.opacity=1;
							removeEvent(this,'mouseover', MouseOver );		
								if(this.className != 'active'){

                for (j=0; j<im.length; j++) {
                    im[j].className = '';
                }
								<!-- alert(this.childNodes[0].src); -->
								this.childNodes[0].src = "images_gross/image"+ this.childNodes[0].id + "_780x780.jpg";
                this.className = 'active';
								
            									 	 							}
								else{
								
  								if (unterMenue == 0) {
  									 gal.addEvent(this,'mouseover', MouseOver);
  								} 
									               
								for (j=0; j<im.length; j++) {
                    im[j].className = '';
								
									
                }}}
		
}
	function Starten() {
					 unterMenue = 0;	
					 var li = document.getElementById('jgal').getElementsByTagName('li');
					 
					 for (i=0; i<li.length; i++) {<!-- IE führt sonst addEvent nicht aus -->
  					 		 removeEvent(li[i],'click',Clicken);
								 li[i].style.cursor = 'default';
  					}
						
					 for (i=0; i<li.length; i++) {
						  gal.addEvent(li[i],'mouseover', MouseOver);
  						gal.addEvent(li[i],'mouseout',MouseOut);
							
              gal.addEvent(li[i],'click',Clicken);
							
						 li[i].style.filter = "alpha(opacity='100')";
						 li[i].style.KhtmlOpacity=1;
						 li[i].style.MozOpacity = 1;
						 li[i].style.opacity=1;
						 li[i].className = '';
						 li[i].style.cursor = 'pointer';

					 }
}
	function Einblenden(bilder, bilderAus){
					
					 ImTransparenz(bilder, "1");
					 ImTransparenz(bilderAus, "0.1");
					 var li = document.getElementById('jgal').getElementsByTagName('li');
  						for (i=0; i<li.length; i++) {
    					 removeEvent(li[i],'mouseover', MouseOver );
    					 removeEvent(li[i],'mouseout', MouseOut );
  					 }
						 
						  for (i=0; i<li.length; i++) {  <!-- IE führt sonst addEvent nicht aus -->
  					 		 removeEvent(li[i],'click',Clicken);
								 li[i].style.cursor = 'default';
  					 }
						 

						  
						  for (i=0; i<bilder.length; i++) {
  					 		 gal.addEvent(li[bilder[i]],'click',Clicken);  <!-- Problem -->
								 li[bilder[i]].style.cursor = 'pointer';
  					 }	
							
							              
						 for (j=0; j<li.length; j++) {
                    li[j].className = '';
              }
							
}

		var i;
var gal = {



		
    init : function() {
        if (!document.getElementById || !document.createElement || !document.appendChild) return false;
        if (document.getElementById('gallery')) document.getElementById('gallery').id = 'jgal';
        var li = document.getElementById('jgal').getElementsByTagName('li');
				
				
				<!--alert(Webdesign.id);-->
				<!-- Auskommentiert, erstes Element wird beim Start vergrößert angezeigt -->
       <!--  li[0].className = 'active'; -->

        for (i=0; i<li.length; i++) {
            li[i].style.backgroundImage = 'url(' + li[i].getElementsByTagName('img')[0].src + ')';
						<!-- alert('url(' + li[i].getElementsByTagName('img')[0].src + ')'); -->
            li[i].style.backgroundRepeat = 'no-repeat';
            li[i].style.filter = "alpha(opacity='100')";/* IE-Transparenz */
						li[i].style.KhtmlOpacity=1; /* Konqueror */
						li[i].style.MozOpacity = 1;/* Gecko */
						li[i].style.opacity=1;/* Opera */
						unterMenue = 0;
					if (i==1){
					
					
					 var vita = document.getElementById('vita');
					 
					 gal.addEvent(vita,'click',function vita() {
					 unterMenue = 1;
					 bilder=new Array("0");
					 bilderAus=new Array("1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24");
					 Einblenden(bilder,bilderAus);
					 });
					
 
					 
					 var broschueren = document.getElementById('broschueren');
					 
					 gal.addEvent(broschueren,'click',function broschueren() {
					 unterMenue = 1;
					 bilder=new Array("3","10","11","13","14");
					 bilderAus=new Array("0","1","2","4","5","6","7","8","9","12","15","16","17","18","19","20","21","22","23","24");
					 Einblenden(bilder,bilderAus);
					 });
					 
					 
					 var flyer = document.getElementById('flyer');
					 
					 gal.addEvent(flyer,'click',function flyer() {
					 unterMenue = 1;
					 bilder=new Array("5","12","17","23");
					 bilderAus=new Array("0","1","2","3","4","6","7","8","9","10","11","13","14","15","16","18","19","20","21","22","24");
					 Einblenden(bilder,bilderAus);
					 });
					 
					 
					 var kataloge = document.getElementById('kataloge');
					 
					 gal.addEvent(kataloge,'click',function kataloge() {
					 unterMenue = 1;
					 bilder=new Array("8","18","22");
					 bilderAus=new Array("0","1","2","3","4","5","6","7","9","10","11","12","13","14","15","16","17","19","20","21","23","24");
					 Einblenden(bilder,bilderAus);
					 });
					 
					 var illustration = document.getElementById('illustration');
					 
					 gal.addEvent(illustration,'click',function illustration() {
					 unterMenue = 1;
					 bilder=new Array("1","2","6","7","9","20","21");
					 bilderAus=new Array("0","3","4","5","8","10","11","12","13","14","15","16","17","18","19","22","23","24");
					 Einblenden(bilder,bilderAus);
					 });
					 
					 var verpackungen = document.getElementById('verpackungen');
					 
					 gal.addEvent(verpackungen,'click',function verpackungen() {
					 unterMenue = 1;
					 bilder=new Array("1","2","6","7","19");
					 bilderAus=new Array("0","3","4","5","8","9","10","11","12","13","14","15","16","17","18","20","21","22","23","24");
					 Einblenden(bilder,bilderAus);
					 });
					 
					 
					 var webdesign = document.getElementById('webdesign');
					 
					 gal.addEvent(webdesign,'click',function webdesign() {
					 unterMenue = 1;
					 bilder=new Array("4","15","21");
					 bilderAus=new Array("0","1","2","3","5","6","7","8","9","10","11","12","13","14","16","17","18","19","20","22","23","24");
					 Einblenden(bilder,bilderAus);
					 });					 
					 
					 
					 
					 var Start = document.getElementById('start');
					 
					 gal.addEvent(Start,'click',Starten);
					 				 
					 
					 var Start2 = document.getElementById('start2');
					 
					 gal.addEvent(Start2,'click',Starten);
					 }/*Klammer if (i==1) */
					
           gal.addEvent(li[i],'mouseover', MouseOver);
					  
						
						gal.addEvent(li[i],'mouseout',MouseOut);
						
						
            gal.addEvent(li[i],'click',Clicken);
						
						};

								
 /* 							var divgal = document.getElementsByTagName('img');
							  for (i=0; i<divgal.length; i++) {
						    gal.addEvent(divgal[i],'mouseout',function(e) {
								
								var target;
								var e;
								
								/*var eventt = window.event;
								var camefrom = e.Target || e.fromElement;
								var go_to = e.srcElement || e.toElement;*/
								
	/*							var im = document.getElementById('jgal').getElementsByTagName('li');
                for (j=0; j<im.length; j++) {
                    im[j].className = '';
                }
                this.className = '';
								
								
								
            })};					
				
    */},

		
    addEvent : function(obj, type, fn) {
        if (obj.addEventListener) {
            obj.addEventListener(type, fn, false);
        }
        else if (obj.attachEvent) {
            obj["e"+type+fn] = fn;
            obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
            obj.attachEvent("on"+type, obj[type+fn]);
        }
    }
}

gal.addEvent(window,'load', function() {
    gal.init();
});

function removeEvent( obj, type, fn )
{
   if (obj.removeEventListener) {
      obj.removeEventListener( type, fn, false );
   } else if (obj.detachEvent) {
      obj.detachEvent( "on"+type, obj[type+fn] );
      obj[type+fn] = null;
      obj["e"+type+fn] = null;
   }
}


 function addEvent (obj, type, fn) {
        if (obj.addEventListener) {
            obj.addEventListener(type, fn, false);
        }
        else if (obj.attachEvent) {
            obj["e"+type+fn] = fn;
            obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
            obj.attachEvent("on"+type, obj[type+fn]);
        }
    }


/*function preloader()
{
 bild = new Array();
 
  for (i=1; i<17; i++) {
  bild[i-1]=new Image();
  bild[i-1].src="thumbs/thumb" + i + "_180x180.jpg";
	
	}
}

function preloadImages() {
  var d=document; if(d.images){ if(!d.p) d.p=new Array();
    var i,j=d.p.length,a=preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.p[j]=new Image; d.p[j++].src=a[i];}}
}
*/