Zellenhintergrund bei Mouseover

planula

Grünschnabel
Hallo an alle.
Ich brauche eure Hilfe!
Kann mir jmd. sagen wie ich es schaffe bei einem Mouseover über eine Tabelle Gleichzeitig den Tabellenhintergrund und die Schriftfarbe zu ändern?
Würde mich sehr über Antworten freuen!
Danke im Vorraus

Gruß Planula

P.S. muss auch nicht in Java sein!
 
Hi,

das ist nur eine von vielen möglichkeiten:

Code:
<html>
<head>
    <script type="text/javascript">
    function setStyle(obj){
      obj.style.backgroundColor = 'red';
      obj.style.color = 'white';
    }
    
    function resetStyle(obj){
      obj.style.backgroundColor = 'white';
      obj.style.color = 'black';
    }
    </script>
</head>
<body>
<table border='1'>
<tr>
  <td onmouseover='setStyle(this)' onmouseout='resetStyle(this)'> test1 </td>
  <td onmouseover='setStyle(this)' onmouseout='resetStyle(this)'> test2 </td>
  <td onmouseover='setStyle(this)' onmouseout='resetStyle(this)'> test3 </td>
</tr>
</table>
</body>
</html>

so nebenbei: Java hat sogut wie nichts mit Javascript zu tun....


bye
 
Code:
html>
<head>
<title> 21 </title>

 <script type="text/javascript">
    function setStyle(obj){
      obj.style.backgroundColor = '#E66043';
      obj.style.color = '#000000';
    }
    
    function resetStyle(obj){
      obj.style.backgroundColor = '#005CA2';
      obj.style.color = 'white';
    }
    </script>
</head>
<body  bgcolor="#E66043" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF">


<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="000000" width="1176" id="AutoNumber1">
  <tr>
    <td onmouseover='setStyle(this)' onmouseout='resetStyle(this)' width="69" bgcolor="#005CA2" align="center"> 
    <b><font color="#FFFFFF" face="Verdana" size="2">
    <a href="aktive.htm" style="text-decoration: none"><font color="#FFFFFF">Aktive</font></a> </font></b> </td>
  	<td onmouseover='setStyle(this)' onmouseout='resetStyle(this)' width="75" bgcolor="#005CA2" align="center"> 
    <b><font color="#FFFFFF" face="Verdana" size="2">Passive </font></b> </td>
  	<td onmouseover='setStyle(this)' onmouseout='resetStyle(this)' width="142" bgcolor="#005CA2" align="center"> 
    <b><font color="#FFFFFF" face="Verdana" size="2">Ehrenmitglieder </font></b> </td>  
  	<td onmouseover='setStyle(this)' onmouseout='resetStyle(this)' width="1922" bgcolor="#005CA2" align="center"> &nbsp;</td>  </tr>
</table>


</body>
</html>


geht noch nicht so richtig Keine ahnung wieso nicht der Hintergrund ändert sich noch aber die schrift bleibt weiß!
Brauche nochmal eure Hilfe!
Möchte gerne die Schrift beim rollover in schwarz haben. Kann mir einer sagen wie das geht

Gruß Pl4nul4
 
Das liegt an den "Font" Tags - damit überschreibst du leider den Effekt. Ich würde dir dringed raten, das du dich mal ein bisschen mit CSS auseinadersetzt. Die Font Tags haben NUR nachteile. CSS ansich ist auch nicht schwerer zu lernen als HTML und bei fragen wird dir hier sicherlich schnell geholfen. Ich hab dir das mal auf CSS umgeschrieben - dann funktionierts auch:
PHP:
<html>
<head>
<title> 21 </title>

 <script type="text/javascript">
    function setStyle(obj){
      obj.style.backgroundColor = '#E66043';
      obj.style.color = '#000000';
    }
    
    function resetStyle(obj){
      obj.style.backgroundColor = '#005CA2';
      obj.style.color = 'white';
    }
 </script>
 <style type="text/css">
 body {
   background-color:#e66043;
 }
 
 td{ 
   font-family:verdana;
   font-size:14px;
   color:#ffffff;
   font-weight:bold;
   background-color:#005CA2;
 }
 
 a:link, a:visited, a:active{
   color:#ffffff;
   text-decoration:none;
 }
 
 a:hover{
   color:#000000;
 }
 
 table{
   border-collapse:collapse;
   border-color:#000000;
 }
 </style>
</head>
<body>


<table border="0" cellpadding="0" cellspacing="0" width="1176" id="AutoNumber1">
  <tr>
    <td onmouseover='setStyle(this)' onmouseout='resetStyle(this)' width="69" align="center"> 
      <a href="aktive.htm" style="text-decoration: none">Aktive</a>
    </td>
  	<td onmouseover='setStyle(this)' onmouseout='resetStyle(this)' width="75" align="center"> 
      Passive
    </td>
  	<td onmouseover='setStyle(this)' onmouseout='resetStyle(this)' width="142" align="center"> 
      Ehrenmitglieder 
    </td>  
  	<td onmouseover='setStyle(this)' onmouseout='resetStyle(this)' width="1922" align="center">  
      &nbsp;
    </td>  
  </tr>
</table>


</body>
</html>

bye
 
Hi, ich brauche dringend eure Hilfe...!

Das Script so wie oben ist gut und funktioniert, bloß leider nur in ZELLEN, geht das auch für ZEILEN ?

MfG WMK und vielen Dank im Voraus!
 
Sollte gehen, wenn du es in die tr-Tags reinpackst:
Code:
<tr onmouseover="setStyle(this);" onmouseout="resetStyle(this);">
 
Jo, das hatte ich dann auch probiert, und es geht :-)
Vielen Dank!

Eine Frage habe ich noch: Kennt einer vielleicht phpMyAdmin? Da kann man Tabellenzeilen sogar markieren! So dass bei einem Klick die Rolloverfarbe (oder eine andere) solange bleibt bis man nochmals klickt! Weiß einer wie das geht?

Danke im Voraus, MfG WMK
 

Neue Beiträge

Zurück