Njeb: ausfahrbare div box

Beitrag lesen

SELF-Forum

ausfahrbare div box

Njeb
– Informationen zu den Bewertungsregeln

Hallo zusammen,

ich hoffe ich bin hier richtig..

ich habe einen div-layer der sich per javascrip bei "mouseover" ausfahren und "onmouseout" wir einfahren soll...

<html>  
<head>  
<title>divbox</title>  
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">  
<style type="text/css">  
  <!--  
body{ background: #fff;}  
#divKO{ border:1px solid #804000;  
        background-color:#906;  
        width: 120px;  
        height: 40px;  
		position:fixed; bottom:10px; right:50px;}  
 //-->  
</style>  
<script type="text/javascript">  
  <!--  
var intMin   = 40; // Min. höhe des DIVs  
var intMax   = 100; // Max. höhe des DIVs  
var intStep  = 2;   // Schrittweite, um die das DIV in seiner Grösse geändert wird  
var intDelay = 5;   // Verzögerung in Millisekunden  
  
var blnBig   = false;  
var hTimer   = null;  
  
function initResize(){  
  blnBig = (blnBig)? false : true;  // false => verkleinern, true => vergrössern  
  
  // Falls noch ein Timer läuft -> beenden  
  if(hTimer != null) window.clearTimeout(hTimer);  
  // Resize-Funktion verzögert aufrufen  
  hTimer = window.setTimeout("resizeDiv()", intDelay);  
}  
  
function resizeDiv(){  
  // Vorzeichen zum Vergrössern (1)/Verkleinern (-1) bestimmen  
  var intSgn = (blnBig)? 1 : -1;  
  
  // Element ermitteln, das in der Grösser verändert werden soll  
  var objDiv = document.getElementById("divKO");  
  
  //  Falls der Brower die Methode "getComputedStyle" kennt (W3C-DOM)  
  if(window.getComputedStyle){  
    var strHeight = window.getComputedStyle(document.getElementById("divKO"), null).getPropertyValue("height");  
  //  Falls der Browser die Methode "currentStyle" kennt (neuere IEs)  
  }else if(document.getElementById("divKO").currentStyle){  
    var strHeight = document.getElementById("divKO").currentStyle["height"];  
  }  
  
  // Neue Grösse zuweisen  
  objDiv.style.height = (parseInt(strHeight) + intSgn*intStep) + "px";  
  // Falls die neue Grösse noch innerhalb der Grenzen liegt -> Resize-Funktion erneut aufrufen  
  if((parseInt(objDiv.style.height) >= intMin) && (parseInt(objDiv.style.height) <= intMax)){  
    hTimer = window.setTimeout("resizeDiv()", intDelay);  
  }  
}  
 //-->  
</script>  
</head>  
<div id="divKO" onmouseover="initResize();" >  
  <p align="center">KONTAKT</p>  
</div>  
</body>  
</html>

nun funktioniert das aus bzw einfahren nicht wirklich sauber...

ich bin in javascript leider überhaupt nicht fit und wäre daher für verbesserungsvorschläge sehr dankbar..

Beitrag melden
–
Informationen zu den Bewertungsregeln