onmouseover multipli contemporaneamente su tabella

**papalagi** · 12-11-2012, 13:22

Ciao,
ecco il mio problema:

Data una tabella, come faccio a cambiare il colore di più celle NON ALLINEATE con un singolo evento mouseover?

codice:

<td>
 <ul>[*]Uno[*]Due[*]Tre/li>
</td>[/list]

<td>
   <ul>[*]Quattro[*]Cinque [*]Sei[/list]
</td>

Vorrei cioè che al mouseover su "Uno" cambiasse colore anche "Sei".
Possibile?
Grazie.

**Mich_** · 13-11-2012, 09:47

In quel codice c'e` un po' di confusione (nella logica, perche` nella sintassi non ci sono errori):
parli di celle (si intende di tabella), ma poi ti riferisci ad elementi di lista.

Comunque se non puoi creare una gerarchia di oggetti innestati (indipendentemente dal loro posizionamento), la soluzione si puo` ottenere solo tramite Javascript.

Sposto nel forum JS.

**cavicchiandrea** · 13-11-2012, 10:23

@papalagi ciao e benvenuto, ti ricordo che il cross-post (stessa discussione su più forum) è vietato ricordatelo in futuro.

**papalagi** · 13-11-2012, 11:02

scusate per gli errori ma sono proprio alle prime armi.

allora, con JS non so come strutturare il codice per associare il mouseover ai due elementi di lista
Questo è sicuramente sbagliato ma non so come correggerlo:

...
<script>
document.getElementById("rosso").onMouseOver.style .backgroundColor="red";
</script>
</head>

<body>
<td>
<ul>
<li id="rosso">Uno[*]Due[*]Tre/li>
</td>[/list]

<td>
<ul>[*]Quattro[*]Cinque
<li id="rosso">Sei[/list]
</td>
...

**papalagi** · 13-11-2012, 11:04

@cavicchiandrea scusa ma non sapevo quale fosse il posto più adatto e nel dubbio...
cancellerei l' altra ma dal mio profilo vedo solo questa

**Mich_** · 13-11-2012, 16:23

Anzitutto devi evitare errori grossolani di HTML, altrimenti il JS non sa cosa fare:
Non si possono dare due nomi uguali a due oggetti diversi (id="rosso").

Poi per come procedere, fa' una riceerca in questo forum: e` un problema gia` affrontato e risolto, per cui esiste gia` la soluzione pubblicata.

**papalagi** · 13-11-2012, 17:13

Avevo fatto la ricerca prima di aprire la discussione, l' ho rifatta adesso ma non trovo quello che fa al caso mio. Tu hai il link della soluzione di cui parli?
Grazie per le correzioni, ho modificato così ma suppongo che ancora non ci siamo.
Se non il link almeno mi puoi indirizzare a grandi linee sul metodo giusto?

<script>
function colore()
{
document.style.backgroundColor="red";
}
document.getElementById("rosso").onMouseOver.style .backgroundColor="red";
</script>
</head>

<body>
<td>
<ul>
<li onmouseover="colore()">Uno[*]Due[*]Tre/li>
</td>[/list]

<td>
<ul>[*]Quattro[*]Cinque
<li id="rosso">Sei[/list]
</td>
...

**Mich_** · 13-11-2012, 17:39

Non ho lo script pronto. Anch'io andrei a cercare spunti.

Pero` non puoi improvvisarti programmatore: un minimo di basi dovresti averle prima di procedere.

Visto che ti mancano le basi, prova con questa sintassi (non e` corretta secondo la programmazione, ma dovrebbe funzionare in quasi tutti i browser) - ed elimina quanto contenuto nel tuo <script>

codice:

<td>
  <ul>
    <li onmouseover="document.getElementById('rosso').style.backgroundColor='red';">Uno[*]Due[*]Tre/li>[/list]
</td>

<td>
  <ul>[*]Quattro[*]Cinque
    <li id="rosso">Sei[/list]
</td>

Nota che JS e` case-sensitive;
e nota che in questo esempio " e ' hanno significati diversi

**papalagi** · 13-11-2012, 17:59

Grazie per la pazienza e le risposte anche se ancora non li colora entrambi ma solo Sei...

**Mich_** · 13-11-2012, 18:52

Questo e` quello che fa quel JS.
per colorare quello dove hai il mouse, ti basta la pseudoclasse :hover del CSS.

Poi se vuoi fare passi avanti con JS, devi iniziare con un corso (vedi quello di HTML.it - mi era sembrato buono, quando lo avevo guardato)

Discussione: onmouseover multipli contemporaneamente su tabella

Strumenti discussione

Ricerca discussione

Visualizza

onmouseover multipli contemporaneamente su tabella

Permessi di invio