Newsgroup: it.comp.lang.javascript
Titolo: Mouseover e tabelle...

salve ragazzi...
mi sto avvicinando direi a....DENTONI al mondo dei javascript...e ho un 
piccolo problema...
Ho una tabella...3 righe e tot colonne...
Nella prima riga, immagini, che al mouseover cambiano, e ci siamo, ci sono 
riuscito...
Nella seconda riga testi, che al mouse over cambiano, e anche qui ci 
siamo...
Il problema e' questo....nei due eventi mouseover, oltra a cambiare il 
contenuto della propria cella, dovrei riuscire a far cambiare il contenuto 
della cella della 3 riga corrispondente alla propria colonna...
Semplicemente...al mouseover della cella 1-2 e 1-3, mi deve cambiare 
l'immagine contenuta nella cella 1-3..
Come devo fare? Immagino di dover aggiungere del codice nell'evento 
mouseover della cella 1-2 e 1-3, ma francamente... :-(
Son un po' in crisi...
E' gia' tanto sia riuscito a risolvere il problema superiore...eheheh...
Questo e' il codice che ho nel mouseover della cella 1-1..
<td width="126" align="center" valign="middle"><a href="whois.htm" 
onMouseOver="RollOver('img1','img1_on')" 
onMouseOut="RollOver('img1','img1')"><img src="img/wWhois.jpg" name="img1" 
border="0"></a></td>
ovviamente mi va a richiamare uno script esterno che funziona 
perfettamente...
Dalla mia ignoranza, credo di dover richiamare, usando sempre script esterni 
in modo da riutilizzarli per altre pagine, un nuovo script che fa quello che 
chiedo...ma come lo richiamo? Come gli dico di scriver nella cella 1-3??
Thanks a lot!
Davide 

 della cella della 3 riga corrispondente alla propria colonna...
In generale puoi eseguire quante function vuoi separandole con ; (quindi,
nel tuo caso, sarà un RollOver(...);AltraTuaFunction()
-- 
"That until there is no longer first class
And second class citizens of any nation
Until the colour of a man's skin
Is of no more significance than the colour of his eyes
Me say war"
B.M.

 nel tuo caso, sarà un RollOver(...);AltraTuaFunction()
Per la tua richiesta io userei (previa verifica compatibilità) cellIndex,
che ti indica la posizione della cella nella riga.
A grandi linee la tua function (prende ciò che vi è dentro la cella dove si
trova il mouse e lo scrive nella riga 3 della stessa tabella nella stessa
posizione) potrebbe essere un qualcosa del tipo (scrivo al volo):
 function Scrivi(sender) {
sender.parentNode.parentNode.parentNode.rows[2].cells[sender.cellIndex].innerHTML=sender.innerHTML;
} 
Da chiamare onmouseover con Scrivi(this).
Mi raccomando però di verificare compatibilità per i browser che ti
interessano (p.e. non sono sicuro parentNode funzini con IE4, se ti
interessa IE4, non so cellIndex, non so per vecchi browser la collection
rows).
Attenzione anche a eventuali colspan/rowspan nella tabella che potrebbero
alterare il risultato.
-- 
"Affacciati affacciati benedici, guardaci
 guardaci...guardaci!
 Tanto sono quasi duemila anni che stai a guardare!"
									    E.B.

 ha scritto nel messaggio
[CUT]
Intanto grazie mille per l'interessamento...poi...non ho specificato
benissimo...
Anzitutto non conoscevo il comando cellindex, che a questo punto credo
propruio sia quello che mi e' necessario..
Cmq...cerco di esser piu' chiaro..
Non devo prendere il contenuto della cella oggetto del mouse over..
Prtaticamente...
onmouseover cella 1 colonna 1 riga 1 1° cambia l'immagine A della cella 1
colonna 1 riga 1 con l'immagine B , 2° cambia l'immagine C  della cella 1
colonna 1  riga 3 con l'immagine D
onmouseover cella 1 colonna 1 riga 2 1° cambia l'immagine E della cella 1
colonna 1 riga 2 con l'immagine F , 2° cambia l'immagine C  della cella 1
colonna 1  riga 3 con l'immagine D
"""<td width="126" align="center" valign="middle"><a href="whois.htm"
onMouseOver="RollOver('img1','img1_on')"
onMouseOut="RollOver('img1','img1')"><img src="img/wWhois.jpg" name="img1"
border="0"     """"  Se non ho capito male sino qua e' corretto, e qui devo
aggiungere il cellindex e quello che deve fare nella cella 1 riga 3 e poi
chiudere il tag  ></a></td>
Ecco..cosi' devo fare...
Effettivamente mi ero spiegato male prima..e sembrava dovessi fare
esattamente come mi hai spiegato tu...
Per ora grazie mille...!
Utile questo news, molto utile...ho spulciato un po' nei gg scorsi per altre
cose e si e' dimostrato molto proficuo...
Grazie mille per ora..!
Davide

 propruio sia quello che mi e' necessario..
Mi raccomando verifica compatibilitą.
Ho visto che usi il name per riferirti alle immagini; quindi:
a) se alle tue immagini dai un name aggiungendo un suffisso con
numeroriga_numerocolonna poi potresti usare questo per riferirti all'altra
immagine (visto che conosci sia la riga che la colonna)
b) facendo come ti ho scritto nell'altro messaggio setti l'innerHTML ma, al
di lą di questo, hai un riferimento alla td corretta.
Quindi, per esempio, se l'immagine nella td č una sola (o č la prima)
potresti fare
sender.parentNode.parentNode.parentNode.rows[2].cells[sender.cellIndex].getElementsByTagName('img')[0].src='altrotuosrc';



..ok..forse inizio a capirci qualcosa...
a questo punto per semplificare ancora il tutto...magari senza fare il
rollout di due immagini nella cella 1 colonna 1 riga 3, potrei di base avere
la cella vuota, sul mouseover aggiungere l'immagine, sul mouseout
toglierla... questo credo semplifichi ancora di piu' il tutto o sbaglio?

 toglierla... questo credo semplifichi ancora di piu' il tutto o sbaglio?
Sbagli, aggiungere un elemento non esistente è una rottura. In più se fai
onmouseover 2 volte? Dovresti comunque verificare se esiste già.
Se all'inizio è vuota metti all'immagine un "display:none" e aggiungi a
quanto sopra anche un sender.......[0].style.display="inline";
-- 
"Ti sei salvato
 o sei entrato in banca pure tu?"
									    A.V.

In data Fri, 6 May 2005 15:29:20 +0200, Cristiano Larghi ha scritto:
[CUT]
Dimenticavo: complimenti per il Nick! (meno male non è Lisa, anche se a
conoscerla una manicata di schiaffi glieli darei volentieri :-) )


 In data Fri, 06 May 2005 13:21:28 GMT, BartSimpson® ha scritto:
[CUT]
..anzitutto grazie per il complimento..oramai questo nick mi e' storico...lo
uso dalla prima volta che navigai su internet...il che vuol dire quasi 12
anni fa... :-/
..cmq..ho provato a modificare...ma mi va in errore perche' dice che il
sender non e' definito...
adesso..sicuramente sono io che faccio del casino....cmq...la riga di codice
e' diventata questa....cosa sbaglio?
<td width="126" align="center" valign="middle"><a href="lavori.htm"
onMouseOver="RollOver('img1','img1_on')"
onMouseOut="RollOver('img1','img1')"><img src="img/wWhois.jpg" name="img1"
border="0"
onMouseOver="sender.parentNode.parentNode.parentNode.rows[2].cells[sender.ce
llIndex].getElementsByTagName('img')[0].src='cos.jpg'"></a></td>

 llIndex].getElementsByTagName('img')[0].src='cos.jpg'"></a></td>
sender č il parametro della function, se lo fai direttamente devi usare
this (this.parentNode.....cells[this.cellIndex]....
-- 
"E' l' ignoranza che crea l'intolleranza
 di gente cieca e senza coscienza"
									  S.S.S.

 ha scritto nel messaggio
news:lw445mpe...@ID-147253.user.individual.net...
a questo punto sono io che sono uno zuccone..... :-D
Ora mi dice che e' nullo o no ne' un oggetto.. :-/
<td width="126" align="center" valign="middle" height="91"><a
href="lavori.htm" onMouseOver="RollOver('img1','img1_on')"
onMouseOut="RollOver('img1','img1')"><img src="img/wWhois.jpg" name="img1"
border="0"
onMouseOver="this.parentNode.parentNode.parentNode.rows[3].cells[this.cellIn
dex].getElementsByTagName('img')[0].src='img/cos.jpg'" ></a></td>
epure mi sembra corretto....

 ha scritto nel messaggio
news:lw445mpe...@ID-147253.user.individual.net...
anzi scusa...l'avevo inserito nel tag sbagliato...
<td width="126" align="center" valign="middle" height="91"><a
href="lavori.htm" onMouseOver="RollOver('img1','img1_on')"
onMouseOut="RollOver('img1','img1')"
onMouseOver="this.parentNode.parentNode.parentNode.rows[2].cells[this.cellIn
dex].getElementsByTagName('img')[0].src='img/cos.jpg'" ><img
src="img/wWhois.jpg" name="img1" border="0" ></a></td>
cosi' non mi va in errore...pero'..non succede niente....

 dex].getElementsByTagName('img')[0].src='img/cos.jpg'" ><img
Come ti dicevo devi separare con ; le funzioni, non puoi mettere 2 eventi
uguali (altrimenti ne esegue solo uno dei 2, immagino il primo)
 onmouseover="RollOver('img1','img1_on');this.parentNode..........."
p.s. scrivili minuscoli gli eventi (e anche tutto il resto).
-- 
"Emancipate yourselves from mental slavery;
None but ourselves can free our minds"
									    B.M.

 dex].getElementsByTagName('img')[0].src='img/cos.jpg'" ></a></td>
Dunque: con parentNode ti riferisci all'oggetto contenitore.
Quindi, nel mio esempio, partendo dalla td: parentNode=>tr;
.parentNode=>tbody; .parentNode=>tabella.
Nel tuo caso invece parti dall'immagine, e quindi devi "passare" dalla td.
Ergo occorre un parentNode in piů
(this.parentNode.parentNode.parentNode.parentNode.rows....)


 ha scritto nel messaggio
news:14m1f6fo...@ID-147253.user.individual.net...
ok perfetto..sn qua ho capito...
infatti se metto cosi'..
<td width="126" align="center" valign="middle"
height="91"><ahref="lavori.htm"
onMouseOver="this.parentNode.parentNode.parentNode.parentNode.rows[3].cells[
this.cellIndex].getElementsByTagName('img')[0].src='img/cos.jpg'"
onMouseOut="RollOver('img1','img1')"><img src="img/wWhois.jpg" name="img1"
border="0" width="126" height="81" ></a></td>
mi esegue la funzione...solo che ora mi dice che "cells" e' nullo o non e'
un oggetto...

 un oggetto...
Uhm...scusami ma non ho tempo per fare un test. Forse devi "ripassare" dal
tbody (e quindi quando arrivi alla tabella non vorrei ci sia un rows in
più.
Quindi (divido per comodità di lettura):
 Tabella=this.parentNode.parentNode.parentNode.parentNode;
 Tbody=Tabella.rows[0]; //oppure Tabella.getElementByTagName('tbody')[0];
 //da qua come prima
 TuaCella=Tbody.rows[3].cells etc etc
 
p.s. attenzione che rows[3] immagino sia la quarta riga, non la terza (le
collection partono tutte da indice zero).
-- 
"Ho smesso di fumare.
 Vivrò una settimana di più.
 E in quella settimana pioverà a dirotto"
									    W.A.

 (le collection partono tutte da indice zero).
si stavo provando con una tabella a 4 righe e non ho cambiato prima di 
copiare il codice.. :-)
Beh..per ora grazie...e buon week! :-)