Fehlfunktion beim Ein- und Ausblenden

[minicrispie]

Hallo,

seit kurzem befasse ich mich malwieder mit JavaScript, da ich in letzter Zeit nur mit C zutun hatte.
Nun habe ich ein Tool geschrieben, was viele kleine Funktion beherbergt. Um Etwas übersicht reinzubringen, wollte ich mit Javascript die Bereiche ein- und ausblenden, sonfern sie gebraucht werden.
Dazu nutze ich mouseover und mouseout. In dem Contentbereich eines Divs habe ich logischerweise Buttons und Textfelder, etc...
Jedesmal, wenn ich über diese Elemente fahre, dann wird die einklapp-funktion ausgelöst. Ich weis nicht, woran es liegt. Könnt ihr mir helfen?

Hier der Code (Stylesheet weggelassen):

  
			function einblenden( obj, akt )  
			{  
				obj.style.opacity = akt;  
				if( akt < 1 )  
				{  
					akt += 0.1;  
					setTimeout( function() { einblenden( obj, akt ); }, 2);  
				}  
			}  
			function ausklappen( obj )  
			{  
				if( obj.getElementsByTagName("div")[1].style.opacity == 0 )  
				{  
					obj.getElementsByTagName("div")[1].style.height = obj.getAttribute("title") + "px";  
					einblenden( obj.getElementsByTagName("div")[1], 0 );  
				}  
			}  
			function einklappen( obj )  
			{  
				obj.getElementsByTagName("div")[1].style.height  = "0px";  
				obj.getElementsByTagName("div")[1].style.opacity =   0.0;  
			}  

  
		<div class="bereich" onmouseover="ausklappen(this)" onmouseout="einklappen(this)" title="250">  
			<div class="bereich_header">  
				Vom Hexadezimalen ins Dezimale -> Farbcode  
			</div>  
			<div class="bereich_content">  
				Eingabe des Hexadezimalwertes: <input type="text" id="eingabe_hex">  
				<input type="button" onclick="hex_berechne()" value=" Berechnen ">  
				<br>  
				<b>Ergebnis:</b><br>  
				<span id="hex_output"></span>  
			</div>  
		</div>  

MfG. Christoph Ludwig