Beiträge von freak36558

    Hallo allerseits...


    Ich muss zu anfang gleich erwähnen das ich mir über diverse Tutorials vor einigen Jahren den Aufbau einer Webspell Page angeeignet habe.
    Und diese via Dreamweaver zusammensetze halt mit Tabellen (Ihr wisst sicherlich wie ich das meine :D)
    Habe bislang wenn ich meine Webspell Pages gemacht habe mit direkter Navigation über die Tabelle gearbeitet...
    Also Hintergrund Bild oder auch Roll-Over Bild mit Link halt...
    Nun wollte ich mich dran Probieren ein Roll-Over Button zu nehmen und diesen mit einem Dropdown Menü auszustatten...
    Soweit sogut...
    Bin auch soweit gekommen das mir des Menü angezeigt wird...
    Nur leider funktioniert aus irgend welchen Gründen der Hover nicht O_o also kurz um wird dauerhaft Aktiv angezeigt...
    Habe mal einen Screenshot mit beigehangen da sich die Page noch nicht aufm Webspace befindet...
    Und natürlich die nötigen Code Schnippsel


    Und wenn ich unter # Submenü (Display None) eintrage taucht des Menü gar net auf


    HTML:

    HTML
    1. </head><body onload="MM_preloadImages('Bilder/GallingerDR_08.jpg','Bilder/GallingerDR_09.jpg','Bilder/GallingerDR_10.jpg','Bilder/GallingerDR_11.jpg')"><center><table width="1000" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="Bilder/GallingerD_01.jpg" width="1000" height="131" /></td> </tr> <tr> <td><table width="1000" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="682"><img src="Bilder/GallingerD_02.jpg" width="683" height="160" /></td> <td width="291" background="Bilder/GallingerD_03.jpg">&nbsp;</td> <td width="27"><img src="Bilder/GallingerD_04.jpg" width="27" height="160" /></td> </tr> </table></td> </tr> <tr> <td><img src="Bilder/GallingerD_05.jpg" width="1000" height="18" /></td> </tr> <tr> <td><table width="1000" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="71"><img src="Bilder/GallingerD_06.jpg" width="71" height="55" /></td> <td width="94" ><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image34','','Bilder/GallingerDR_07.jpg',0)"><img src="Bilder/GallingerD_07.jpg" name="Image34" width="94" height="55" border="0" id="Image34" /></a> <nav> <ul id="submenu"> <li><a href="#">NEWS</a></li> <li><a href="#">NEWS2</a></li> <li><a href="#">NEWS3</a></li> <li><a href="#">NEWS4</a></li> </ul> </nav> </td> <td width="112"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image30','','Bilder/GallingerDR_08.jpg',1)"><img src="Bilder/GallingerD_08.jpg" name="Image30" width="112" height="55" border="0" id="Image30" /></a> <nav> <ul id="submenu"> <li><a href="#">NEWS</a></li> <li><a href="#">NEWS2</a></li> <li><a href="#">NEWS3</a></li> <li><a href="#">NEWS4</a></li> </ul> </nav> </td> <td width="110"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image31','','Bilder/GallingerDR_09.jpg',1)"><img src="Bilder/GallingerD_09.jpg" name="Image31" width="110" height="55" border="0" id="Image31" /></a> <nav> <ul id="submenu"> <li><a href="#">NEWS</a></li> <li><a href="#">NEWS2</a></li> <li><a href="#">NEWS3</a></li> <li><a href="#">NEWS4</a></li> </ul> </nav> </td> <td width="116"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image32','','Bilder/GallingerDR_10.jpg',1)"><img src="Bilder/GallingerD_10.jpg" name="Image32" width="116" height="55" border="0" id="Image32" /></a> <nav> <ul id="submenu"> <li><a href="#">NEWS</a></li> <li><a href="#">NEWS2</a></li> <li><a href="#">NEWS3</a></li> <li><a href="#">NEWS4</a></li> </ul> </nav> </td> <td width="97"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image33','','Bilder/GallingerDR_11.jpg',1)"><img src="Bilder/GallingerD_11.jpg" name="Image33" width="97" height="55" border="0" id="Image33" /></a> <nav> <ul id="submenu"> <li><a href="#">NEWS</a></li> <li><a href="#">NEWS2</a></li> <li><a href="#">NEWS3</a></li> <li><a href="#">NEWS4</a></li> </ul> </nav> </td> <td width="400"><img src="Bilder/GallingerD_12.jpg" width="400" height="55" /></td> </tr> </table></td> </tr>



    CSS
    1. nav ul li{ background: #222222; display: block; text-decoration: none; }
    2. nav ul li a{ color: #222222; padding: 2px; display: block; text-decoration: none; }
    3. #submenu { position: absolute; background: #222222; display: block;}
    4. #submenu li a{ display: block;}
    5. nav li:hover #submenu{ display: block;}


    Vielen Dank schonmal für eure Hilfe... Bin auf dem Gebiet selbst eher noch Anfänger :D






    EDIT


    Problem ist einigermaßen erkannt...
    Musste ja den RollOver Mechanismus in dem <li> tag einbauen... Jetzt ist allerdings das Problem... Sobald ich eben den RollOver Baustein im <li> Tag einsetze, zerreist die Page an der Stelle leider... habe nochmal ein kleines Update hierzu bei gepackt...




    HTML
    1. <td width="71" align="left"><img src="Bilder/GallingerD_06.jpg" width="71" height="55" /></td> <td width="94"> <nav> <ul> <li> <div align="left"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image34','','Bilder/GallingerDR_07.jpg',0)"><img src="Bilder/GallingerD_07.jpg" name="Image34" width="94" height="55" border="0" id="Image34" /></a> <ul id="submenu"> <li><a href="#">NEWS</a></li> <li><a href="#">ABOUT</a></li> <li><a href="#">BLA</a></li> <li><a href="#">HAHA</a></li> </ul> </div> </li> </ul> </nav>
    2. </td>




    [Blockierte Grafik: http://www2.pic-upload.de/img/31550180/Bild1.jpg]



    [Blockierte Grafik: http://www2.pic-upload.de/img/31550179/Bild2.jpg]



    [Blockierte Grafik: http://www2.pic-upload.de/img/31550178/Bild3.jpg]

    Dateien

    • Unbenannt.jpg

      (27,49 kB, 30 Mal heruntergeladen, zuletzt: )