Mike: function bleibt inaktiv

SELF-Forum

function bleibt inaktiv

Mike
– Informationen zu den Bewertungsregeln

Hallo ich habe ein Problem mit einer Function, die die Visibility von mehreren Objecten steuern soll, das aber einfach nicht tut.

Hier der Quelltext.

  
<script type="text/javascript">  
  
/*Buttons*/  
/*für mein Problem noch unwichtig*/  
  
  
Kontakt = new Image();  
Kontakt.src = "images/Kontakt.gif";      /*erste Standard-Grafik */  
Kontakt_klick = new Image();  
Kontakt_klick.src = "images/Kontakt_klick.gif"; /*erste Highlight-Grafik */  
Filmographie = new Image();  
Filmographie.src = "images/Filmographie.gif";      /*erste Standard-Grafik */  
Filmographie_klick = new Image();  
Filmographie_klick.src = "images/Filmographie_klick.gif"; /*erste Highlight-Grafik */  
Vita = new Image();  
Vita.src = "images/Vita.gif";      /*erste Standard-Grafik */  
Vita_klick = new Image();  
Vita_klick.src = "images/Vita_klick.gif"; /*erste Highlight-Grafik */  
  
  
function Bildwechsel (Bildnr, Bildobjekt) {  
  window.document.images[Bildnr].src = Bildobjekt.src;  
}  
  
/*Die folgenden Funktionen funktionieren nicht.*/  
  
function Kontakt () {  
document.getElementById("Home").style.visibility = "hidden";	  
document.getElementById("Filmographie").style.visibility = "hidden";	  
document.getElementById("Vita").style.visibility = "hidden";  
document.getElementById("Kontakt").style.visibility = "visible";  
}  
  
function Filmographie () {  
  document.getElementById("Home").style.visibility = "hidden";	  
  document.getElementById("Kontakt").style.visibility = "hidden";	  
  document.getElementById("Vita").style.visibility = "hidden";  
  document.getElementById("Filmographie").style.visibility = "visible";	  
}  
  
function Vita () {  
  document.getElementById("Home").style.visibility = "hidden";	  
  document.getElementById("Kontakt").style.visibility = "hidden";	  
  document.getElementById("Filmographie").style.visibility = "hidden";	  
  document.getElementById("Vita").style.visibility = "visible";  
}  
</script>  


  
</head>  
  
<body>  
  
<div id="Seite">  
	  
<!--- Navie und Kopfleiste ---------------------------------------------------------->  
  
<table id="Tabelle_navigation" border="0px" cellpadding="0" cellspacing="0">  
 <tr>  
  <td colspan="3" height="15px"><br></td>			  
 </tr><tr>  
  <td>  
   <p onmouseover="Bildwechsel(0, Kontakt_klick)"  
     onmouseout="Bildwechsel(0, Kontakt)"  
     onclick="Kontakt()">  
   <img src="images/Kontakt.gif" id="Button" border="0" alt="Kontakt" >  
   </p>  
  </td><td>  
   <p onmouseover="Bildwechsel(1, Filmographie_klick)"  
      onmouseout="Bildwechsel(1, Filmographie)"  
      onclick="Filmographie()">  
   <img src="images/Filmographie.gif" width="70%"  alt="Filmographie">  
   </p>  
  </td><td>  
   <p onmouseover="Bildwechsel(2, Vita_klick)"  
      onmouseout="Bildwechsel(2, Vita)"  
      onclick= "Vita()">  
   <img src="images/Vita.gif" width="70%"  alt="Filmographie">  
   </p>  
  </td>  
 </tr>  
 <tr>  
  <td colspan="3">  
  <img src="images/Trenner_oben.gif" width="100%" eight="70%"  alt="Trenner_oben"></td>  
 </tr>  
</table>  
  
<!--Body ----------------------------------------------------------------------------->  
<!--Home ----------------------------------------------------------------------------->  
	  
	<div id="Home" style="visibility: visible">  
		Home  
	</div>  
	  
	  
<!--Kontakt -------------------------------------------------------------------------->	  
	  
	<div id="Kontakt" style="visibility: hidden">  
	  Meine Kontaktdaten  
	</div>  
	  
	  
<!--Filmographie ---------------------------------------------------------------------->  
  
	<div id="Filmographie" style="visibility: hidden">  
	  Meine Filmographie  
	</div>  
	  
	  
<!--Vita ----------------------------------------------------------------------------->  
	  
	<div id="Vita" style="visibility: hidden">  
	  Meine Vita  
	</div>  
	  
	  
<!--Fußleiste ------------------------------------------------------------------------>	  
  
	<div id="Fuss">  
	<img src="images/Trenner_oben.gif" width="100%" height="70%" alt="Trenner_unten">  
	</div>  
  
</body>  
</html>
Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. function bleibt inaktiv

    1UnitedPower Homepage des Autors
    +1 Informationen zu den Bewertungsregeln

    Kontakt = new Image();
    /Die folgenden Funktionen funktionieren nicht./

    function Kontakt () {
    document.getElementById("Home").style.visibility = "hidden";
    document.getElementById("Filmographie").style.visibility = "hidden";
    document.getElementById("Vita").style.visibility = "hidden";
    document.getElementById("Kontakt").style.visibility = "visible";
    }

    
> ~~~html
  
  
Du solltest verschiedene Bezeichner für verschieden Konstrukte wählen.  
Im übrigen ist es unschön mit Javascript direkt in den Styles von Elementen rumzufummeln, schöner ist es mit Javascript entsprechende Klassen zu toggeln.  
  

> [code lang=html]

    <table id="Tabelle_navigation" border="0px" cellpadding="0" cellspacing="0">
    [/code]

    Du mißbrauchst Tabellen zum Layouten.

    Für den Bildwechsel scheint mir Javascript sowieso die falsche Technik zu sein, da wärst du mit semantischem HTML und CSS besser bedient.

    Beitrag melden
    +1
    Informationen zu den Bewertungsregeln