Animierter Layer

[wucher wichtel]

Hallo!

http://mf-musicfan.de/div1.jpg
http://mf-musicfan.de/div2.jpg

http://forum.de.selfhtml.org/hilfe/bedienung.htm#verweise-einbinden ;-)

Wieweit ich bin? Naja wiegesagt bin nicht so der Javascript Prof und weiss leider garnicht wo ich anfangen soll!

Du hast z.B. ein <div>. Diesem gibst du eine ID. Auf diese greifst du per document.getElementById() zu. Dann veränderst du mit dem style-Objekt die entsprechenden Werte für height, und padding bzw. margin.

Diese Änderungen rufst du in einer Funktion auf, die per setInterval() startest. Dabei zählst du bei jedem Aufruf der Funktion eine Variable hoch, die z.B. die Pixelanzahl der Höhe angibt. Per if-Bedingung überprüfst du, ob der Wert für die Variable zu hoch wird. Wenn dies der Fall ist, dann unterbrichst du den Interval mit clearInterval().

So in etwa müsste das dann aussehen:

  
var pixel = 0;  
  
function test() {  
 var elem = document.getElementById("bereich").style;  
 elem.height = pixel + "px";  
 pixel = pixel + 5;  
  
 if ( pixel == 200 ) { // Wenn der Bereich höher als 200px wird, dann...  
  clearInterval(neu);  
 }  
}  
window.onload = function() { neu = window.setInterval("test()", 20) };  

ciao, ww