Veröffentlicht 3. April 200322 j 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
3. April 200322 j 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>
Archiv
Dieses Thema wurde archiviert und kann nicht mehr beantwortet werden.