plan_B: Navi geht nicht!!! Problem: "changeStyleById('name','none');"

Beitrag lesen

SELF-Forum

Navi geht nicht!!! Problem: "changeStyleById('name','none');"

plan_B
– Informationen zu den Bewertungsregeln

Hallo,

Ich habe mich bemüht, es so verständlich wiemöglich zu formulieren. wenn ihr trotzdem etwas ned kapiert habt, fragt einfach.

du wirst zugeben müssen, es ist nicht einfach deinen Code zu überblicken und bevor ich mich auch darin verheddere, möchte ich dich auf diesen Artikel aufmerksam machen: Unobtrusive JavaScript

und wenn du dann auch zu dem Schluss kommst, dass du eigentlich nur aus einer Liste von Formularen eines einblenden möchtest, ist alles so einfach:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  
        "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<title>Test ein/ausblenden</title>  
<style type="text/css">  
[code lang=css]  
#nav { list-style-type:none;  }  
#nav h3 {  
 width:10em;  
 background-color:#ffd;  
 margin:10px 50px 0 0;  
 }  
#nav.js_activ h3 { cursor:pointer; }  
  
#nav form {  
 width:400px;  
 margin:0 0 0 200px;  
 display:block;  
 background-color:#ffa;  
 }  
  
#nav.js_activ form { display:none; }

</style>

</head>
<body>
<h1>Thema</h1>
<h2>Unterthema</h2>

<ul id="nav">
<li><h3>Profil</h3>
 <form action="" ><div>
 <input > abc
 <br><select>
 <option> 123 567</option>
 </select>
 </div></form>
</li>
<li><h3>Forum</h3>
 <form action="" ><div>
 <input > abc
 <br><select>
 <option> 123 567</option>
 </select>
 </div></form>
</li>
<li><h3>Chat</h3>
 <form action="" ><div>
 <input > abc
 <br><select><option> 123 567</option></select>
 </div></form>
  </li>
</ul>

<script type="text/javascript">

  
window.onload=function() {  
 var nav=document.getElementById("nav");  
 if (!nav ) alert("no 'nav' found");  
  
 nav.className="js_activ";  
 var hx=nav.getElementsByTagName("h3");  
 if (hx) for (var i=0, h; h=hx[i]; i++) {  
   h.onmouseover= function(){  
   var nav=this.parentNode.parentNode;  
   for (var f=this; f ; f = f.nextSibling ) {  
    if ( f.nodeName.toLowerCase() == "form") {  
     if (nav.old_f && nav.old_f != f ) nav.old_f.style.display="none";  
     f.style.display="block";  
     nav.old_f=f;  // zuletzt actives form merken  
     break;  
     }  
    }  
   }  
  }  
 }

</script>
</body>
</html>
[/code]
ist solche eine Struktur nicht einfach zu überblicken?

Gruß plan_B

--
     *®*´¯`·.¸¸.·
Beitrag melden
–
Informationen zu den Bewertungsregeln