Dropdown Menu mit Javaskript und XHTML

skinner13 · 26.04.2010

Guten morgen liebe Community,

ich habe mir den folgenden Code zusammengebastelt. Wenn man das oberste Bild anklickt öffnet sich ein Dropdownmenu. Dort befindet sich ein weiterer Link der bei klick ein weiteres DD-Menu öffnet. Wenn ich jetzt alles aufgeklappt habe und wieder auf das oberste Bild klicke schließt sich alles ausser das 2te Dropdownmenu. Was für Zeilen hab ich falsch???? Oder welche Zahlen Fehlen??

Vielen Dank schon im vorraus.

HTML:

  <body>
  <script type="text/javascript" language="javascript">
function setVisibility(rowName) {

        var actualVisibility=document.getElementById(rowName).style.visibility;

        if(actualVisibility=='' || actualVisibility=='visible') {
                document.getElementById(rowName).style.visibility = "hidden";
                document.getElementById(rowName).style.display = "none";
        } else {
                document.getElementById(rowName).style.visibility = "visible";
                document.getElementById(rowName).style.display = ""; 
        }
}

function createPlayer(beschreibung, datei){
        var target = document.getElementById("playerdiv");
        var part1= "<embed id=\"player\" src=\"gddflvplayer.swf\" flashvars=\"&autoplay=true&sound=70&desc=";
        var part2="&mylogo=&tracker=&buffer=2&vdo="
        var part3= "\" width=\"800\" height=\"600\" allowFullScreen=\"true\" quality=\"best\" wmode=\"transparent\" allowScriptAccess=\"always\" pluginspage=\"http://www.macromedia.com/go/getflashplayer\" type=\"application/x-shockwave-flash\"></embed>";
        var playercode= part1+beschreibung+part2+datei+part3;
        target.innerHTML = playercode
        target.style.width = (parseInt(document.getElementById('player').width) + 10) + "px";
}
</script>

  <table width="520" border="0">

    <tr>
    <td height="126" colspan="2">  
          <a href="#" onclick="setVisibility('testrow2')+ setVisibility('success')+ setVisibility('testrowdrop')+ setVisibility('testrow1')"><img src="tablehead2.png" border="0" /></a>     
    </td>
    </tr>
     
    
    <tr height="35" id="testrow1" name="testrow1" style="visibility:hidden;display:none; background-image:url(bglines4.png); background-repeat:no-repeat;">
      <td  width="486"><span class="line_txt">testrow1</span>
      </td>
    </tr>
    
    <tr height="35" id="testrow2" name="testrow2" style="visibility:hidden;display:none; background-image:url(bglines4.png); background-repeat:no-repeat;">
      <td width="488"><span class="line_txt">testrow2</span>
      </td>
    </tr>
    
    
    
    
    <tr height="35" id="testrowdrop" name="testrowdrop" style="visibility:hidden;display:none; background-image:url(bglines5.png); background-repeat:no-repeat;">
    <td width="488"> 
       <span class="line_txt">
       <div id="playerdiv" style="margin:0">
       <a href="#" onclick="setVisibility('drop1')+setVisibility('drop2')"></div>testrow_dropdown</a></span>
    </td>
    <td width="32" style="background-image:url(right.png);"></div>          
    
    </td>
    </tr>
    
    <tr height="35" id="drop1" name="drop1" style="visibility:hidden;display:none; background-image:url(bglines4_klein.png); background-repeat:no-repeat; background-position:0px 50%;">
          <td width="488">
              <a href="#"><span class="small_line_txt">testrow3.1 </span></a>
          </td>
          
          <td width="32" style="background-image:url(right.png); background-position:-50px;">DL
          </td>
    </tr>
    
    <tr height="35" id="drop2" name="drop2" style="visibility:hidden;display:none; background-image:url(bglines4_klein.png); background-repeat:no-repeat;">
    <td width="486">
          <span class="small_line_txt">
          <a href="#">testrow3.2</a> </span>
          </td>
          <td width="32" style="background-image:none"><img src="pdf.gif" alt="Download" border="0" />           
    
    </td>
    </tr>
    
    <tr height="35" id="success" name="success" style="visibility:hidden;display:none; background-image:url(bglines4.png); background-repeat:no-repeat;">
      <td width="488"><span class="line_txt">testrow4</span>
      </td>
    </tr>
    
   


  </table>
 
  
  </body>
</html>

GrafiKman · 26.04.2010

AW: Dropdown Menu mit Javaskript und XHTML

Versuche mal das Menü mit Listen zu realisieren statt mit Tabellen, das macht die Sache auch einfacher. Dann noch ein wenig CSS und die Sache wird funktionieren. Wenn du es mit Javascript machen willst gibts hier ein schönen TUT schau mal bei Javascript->Jquery Drowdown menu

chacki · 26.04.2010

AW: Dropdown Menu mit Javaskript und XHTML

Wieso das Rad neu erfinden?

1. Treffer bei Google

Tutorial: jQuery Dropdown Menü mit Superfish | webdemar.com