Cambio colore sfondo TR con onmouseover

**scitrek** · 22-05-2003, 19:55

Domanda semplice: come cambiare il colore di sfondo di una intera RIGA al passaggio del mouse su una singola cella, facendolo poi tornare quello di prima all'allontanamento del mouse (possibilmente senza JS, solo con CSS e HTML)

**lv4er** · 22-05-2003, 20:05

penso proprio nn si possa fare....

puoi fare qualcosa del tipo: metti un link lungo quanto tutta la riga, dello stesso colore dello sfondo, metti cursor: freccina normale (così nn ci viene la manina) e poi fai cambiare colore di sfondo e del link al passaggio del mouse....solo ke nn so se verrà benissimo....puoi provare impostando cellpadding=0 cellspacing=0 in modo ke il testo occupi il più possibile la riga.....

bhe tentar non nuoce....

*pragma · 22-05-2003, 20:15

tra gli head
<style>
TD.primo {
color: #aaddee; BACKGROUND-COLOR: #cc00ff
}
TD.secondo {
color: #ff0000; BACKGROUND-COLOR: #00aa00
}
</style>

in body

<table>

<tr>
<td class="primo" onmouseover="this.className='secondo'"
onmouseout="this.className='primo'">tutto il testo
</td>
</tr>

</TABLE>

**scitrek** · 22-05-2003, 20:17

Questo va ripetuto per ogni TD della riga?

**scitrek** · 22-05-2003, 20:24

grazie per il code, ma il mio problema è cambiare lo sofndo di TUTTA la riga, non solo di una cella...

**piero06** · 22-05-2003, 20:51

se hai preso esattamente il codice che ti hanno postato e ovio perchè c'è una solo riga nel tr !

prova così:

<tr>
<td width="33%"></td>
<td width="33%" class="primo" mouseover="this.className='secondo'"
onmouseout="this.className='primo'">tutto il testo ></td>
<td width="34%"></td>
</tr>

**scitrek** · 22-05-2003, 21:11

ma no, intendevo quel codice iserito nella mia tabella... tranqui, l'html lo conosco...

**sndk4ASP** · 22-05-2003, 22:10

Prova anche così

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
	<head>
		<title></title>
		<script language="javascript">
        function sopra(numeroriga)
 	    {  
 	      document.getElementById("riga" + numeroriga).style.background = "red";
 	      }
        function via(numeroriga)
 	    {  
 	      document.getElementById("riga" + numeroriga).style.background = "transparent";
 	      }
		  
		</script>
	</head>
	<body>
		<table border=1>
			<tr id="riga1" onMouseOver="sopra(1)" onMouseOut="via(1)">
				<td>Uno</td>
				<td>Uno</td>
			</tr>
			<tr id="riga2" onMouseOver="sopra(2)" onMouseOut="via(2)">
				<td>Due</td>
				<td>Due</td>
			</tr>
		</table>
	</body>
</html>

**scitrek** · 26-05-2003, 16:36

il tuo codice funziona, ti ringrazio, ma il problema persiste: il codice funziona solo se alle celle non è assegnato nessun background-color, che io assegno da css. se per dare il colore alla tabella lo imposto nel tag table, mi spariscono i bordi, che devono essere sottili e trasparenti...

ecco un sample:

Discussione: Cambio colore sfondo TR con onmouseover

Strumenti discussione

Ricerca discussione

Visualizza

Cambio colore sfondo TR con onmouseover

Permessi di invio