snopsy Geschrieben 3. April 2003 Geschrieben 3. April 2003 Hi, ich bin gerade dabei ein Menu im Tabellenstil zu erstellen. dabei will ich dass die Tabellenzelle beim überfahren die Hintergrundfarbe wechselt. Dazu habe ich eine Funktion over() und eine Funktion out() geschrieben. bei der Over wird der Hintergrund orange und bei out wieder weiß. Nun will ich aber, dass beim klicken auf einen Link in der Tabellenzelle die Tabellenzelle orange hinterlegt wird. dafür habe ich jetzt mal die funktion click() geschrieben, obwohl man da sicherlich auch die Funktion over aufrufen könnte, weil das die gleiche Farbe ist. Wenn Dann ein anderer Menupunkt angeklickt wird, soll die Tabellenzelle wieder wen weißen Hintergrund annehmen und die Neue Tabellenzelle den oragenen Hintergrund. Leider funktioniert mein onClick nicht. Ich weiß aber nicht, woran das liegt. Kann mir hier vielleicht jemand weiterhelfen? Ich stell euch mal hier ein Teil meines Skriptes zur Verfügung. <html> <head> <link rel='stylesheet' type='text/css' href='text.css'> <script language="JavaScript"> <!-- function over(source) { source.style.backgroundColor = '#FF9933'; } function out(source) { source.style.backgroundColor = '#FFFFFF'; } function click(source) { source.style.backgroundColor = '#FF9933'; } //--> </script> </head> <body> <table width='150' border='1' cellspacing='0' cellpadding='3' style='border-collapse: collapse' bordercolor='#FF9933'> <tr> <th>Titel</th> </tr> <tr> <td onMouseOver="over(this)" onMouseOut="out(this)"><a href="start.html" target="haupt">Link 1</a></td> </tr> </table> </body> </html> [/PHP] Wäre super, wenn mirt jemand helfen könnte! Danke & Gruß Snopsy
Rohde Geschrieben 3. April 2003 Geschrieben 3. April 2003 Das hier dürfte das sein, was Du suchst. IE und Mozilla 1.3 haben damit keine Probleme. Andere Browser hatte ich gerade nicht zur Hand. <style> td{width:50px;height:50px;background-color:#ffffff;} </style> <script> aktuell=0; function rot(id) { if(aktuell!=id) { document.getElementById(id).style.backgroundColor="#ff0000"; } } function weiss(id) { if(aktuell!=id) { document.getElementById(id).style.backgroundColor="#ffffff"; } } function tr(id) { if(aktuell!=0) { document.getElementById(aktuell).style.backgroundColor="#ffffff"; } document.getElementById(id).style.backgroundColor="#ff0000"; aktuell=id; } </script> <table border=1> <tr> <td id=1 onMouseOver="rot('1');" onMouseOut="weiss('1');" onClick="tr('1');"><br></td> <td id=2 onMouseOver="rot('2');" onMouseOut="weiss('2');" onClick="tr('2');"><br></td> </tr> <tr> <td id=3 onMouseOver="rot('3');" onMouseOut="weiss('3');" onClick="tr('3');"><br></td> <td id=4 onMouseOver="rot('4');" onMouseOut="weiss('4');" onClick="tr('4');"><br></td> </tr> </table>
Empfohlene Beiträge
Erstelle ein Benutzerkonto oder melde Dich an, um zu kommentieren
Du musst ein Benutzerkonto haben, um einen Kommentar verfassen zu können
Benutzerkonto erstellen
Neues Benutzerkonto für unsere Community erstellen. Es ist einfach!
Neues Benutzerkonto erstellenAnmelden
Du hast bereits ein Benutzerkonto? Melde Dich hier an.
Jetzt anmelden