wucher wichtel: OOP mit JavaScript

Beitrag lesen

Hallo!

Danke für deine Hilfe! Irgendwie klappt es aber nicht. Ich habe jede mögliche Schreibweise ausprobiert und alle bringen unterschiedliche Fehlermeldungen. Ich verstehe es nicht. Ich poste nochmal den Quelltext. Könntest du mir vielleicht im Quelltext zeigen, was ich wie schreiben muss? Ich weiß, dass alleine machen mehr Spaß macht und einen weiter bringt, aber ich sitze an diesem Problem mit kurzen Unterbrechungen seit heute vormittag und verzweifle so langsam.

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
  
<html>  
<head>  
 <title>Test</title>  
<script type="text/javascript">
~~~~~~javascript
  
  
function Fader(){  
  
 this.opacity   = 1;  
 this.speed   = 0.01;  
 this.stopOpacity = null;  
 this.id    = null;  
 this.isFadeOut  = false;  
 this.errorMsg  = "Ein Fehler";  
  
 this.fadeOut = function (id, stopOpacity) {  
  this.isFadeOut   = true;  
  this.id    = document.getElementById(id);  
  this.opacity  = 1;  
  this.stopOpacity = stopOpacity;  
  
  var newFadeOutOpacity = window.setInterval("Fader.newFadeOut()", 20);  
 };  
  
 this.newFadeOut = function () {  
  this.id.style.opacity = this.opacity;  
  this.opacity   = this.opacity - Fader.speed;  
  
  if ( this.opacity <= this.stopOpacity ) {  
   window.clearInterval(newFadeOutOpacity);  
   Fader.id.style.visibility = "hidden";  
  }  
 };  
  
  
 Fader.fadeIn = function (id, stopOpacity) {  
  if ( Fader.isFadeOut == false ) {  
   alert ( this.errorMsg );  
  } else {  
   Fader.id     = document.getElementById(id);  
   Fader.id.style.visibility  = "visible";  
   Fader.isFadeOut    = false;  
   Fader.stopOpacity   = stopOpacity;  
  
   var newFadeInOpacity    = window.setInterval ("Fader.newFadeIn()", 20);  
  }  
 };  
  
 Fader.newFadeIn = function () {  
  Fader.id.style.opacity = Fader.opacity;  
  Fader.opacity   = Fader.opacity + this.speed;  
  
  if( Fader.opacity >= Fader.stopOpacity ) {  
   window.clearInterval( newFadeInOpacity );  
  }  
 };  
}  
 var myFader = new Fader();  

~~~~~~html
</script>  
</head>  
  
<body>  
<h3 id="opacity_bsp">Beispiel</h3>  
<p>  
 <a href="#" onclick="myFader.fadeOut('fade', 0); return false">fadeOut()</a> |  
 <a href="#" onclick="myFader.fadeIn('fade', 1); return false">fadeIn()</a>  
</p>  
<div style="height: 230px;">  
 <div id="fade" class="text" style="height:210px; width:180px; overflow:hidden; background-color:#000000; color:#FFFFFF">  
  Lorem ipsum dolor sit amet, consectetur adipisicing elit,  
  sed do eiusmod tempor incididunt ut labore et dolore magna  
  aliqua. Ut enim ad minim veniam, quis nostrud exercitation  
  ullamco laboris nisi ut aliquip ex ea commodo consequat.  
  Duis aute irure dolor in reprehenderit in voluptate velit esse  
  cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat  
  cupidatat non proident, sunt in culpa qui officia deserunt mollit  
  anim id est laborum.  
 </div>  
</div>  
</body>  
</html>  

Vielen Dank!

ciao, ww

--
sh:(  fo:|  ch:~  rl:(  br:>  n4:~  ie:%  mo:)  va:)  de:]  zu:)  fl:(  ss:|  ls:~  js:)