Newsgroup: it.comp.www.html
Titolo: un'idea da condividere: aggirare il "bug" di IE sugli :hover non <A>

ciao,
cercavo un modo per ovviare alla gestione di IE dello pseudo-classe CSS
":hover" [IE al momento gestisce naturalmente gli :hover solo per elementi
<A>]: l'effetto che mi serviva, nell'immediato, era il cambio dinamico di
background di una riga di tabella, ma cercavo qualcosa di generico quanto
piu' possibile, come al solito.
in rete (google) ho trovato solo metodi che ritenevo insoddisfacenti, o
perchè troppo complicati (behaviors, con uso di file esterni .htc ecc.) o
perchè mi allontanavano dai CSS (onmouseover con effetto diretto sulla
proprietà style)., o altri ancora (__ieHover_class) che non mi piacevano,
comunque.
alla fine ho elaborato da solo un metodo che, sebbene non velocissimo, è
abbastanza generico e voglio condividerlo, magari a qualcuno tornera' utile,
o sara' di ispirazione: inoltre, se qualcuno riesce a renderlo piu' veloce,
gli saro' grato di farmi capire come..
------8<------------
<html>
 <head>
  <STYLE type="text/css">
   TR.data {
    background-color: #ffffff;
    padding: 2pt;
   }
   TR.data:hover {
    background-color: #ccffcc;
   }
  </STYLE>
 </head>
 <body>
<script>
  //ovviamente si riferisce al primo stylesheet
 function matchcssvalues(target, event) {
target.className?rulename=target.tagName+"."+target.className+event:rulename
=target.tagName+event;
  for (var i = 0; i < document.styleSheets[0].rules.length; i++) {
   if (document.styleSheets[0].rules[i].selectorText==rulename) {
    target.style.cssText= document.styleSheets[0].rules[i].style.cssText;
    break;
   }
  }
 }
</script>
 <table cellpadding="5">
 <tr class="data"
 onmouseover = "matchcssvalues(this, ':hover')"
 onmouseout = "matchcssvalues(this, '')"
 >
 <td>ciao</td>
 </tr>
 </table>
 </body>
</html>
------8<------------
in pratica metto un onmoouseover/onmouseout, ma lego entrambi ad una
funzione che attribuisce all'elemento chiamante lo stesso stile della classe
di cui fa parte, così posso modificare a piacimento lo stile e
l'aggiornamento è automatico. Non è velocissimo, ed ovviamente conviene
mettere le classi css più usate "in cima" allo <style>, perchè vengono
esaminate sequenzialmente..
cmq, non sono un genio del css/html/js, quindi come dicevo, se ci sono
soluzioni migliori...
ciao,
-- 
M@®©o

 piu' possibile, come al solito.
In generale ti consiglio di cambiare il colore di sfondo di una cella al passaggio
del mouse solo se al contenuto è associato un link... altrimenti può essere
disorientante.
Se la cella contiene un link, per estendere l'effetto hover del link all'intera cella
puoi provare con la proprietà display:block
Es:
http://groups.google.it/groups?threadm=asa8cj%242bg%241%40newsreader1.mclink.it
MaRoK

 ciao,
Ciao
-- 
Spoken: How much is that gorilla in the window?
Take our advice, At any price, A gorilla like Magilla is mighty nice.
Gorilla, Magilla Gorilla for sale

 disorientante.
no, e' il contrario, nel mio caso: grandi tabelle con molti dati: senza un
"righello" puo' essere facile perdere il segno.. infatti lo script "ruler"
(post di Magilla) si adatta alla perfezione...
grazie, cmq
-- 
M@®©o

 
http://www.alistapart.com/articles/tableruler/
mi piace molto, è piu' veloce sicuramente.
io sul mouseover/mouseout copiavo tutto il testo dello stile, qui cambia la
classe.
e' decisamente meglio.
grazie,
Marco

 e' decisamente meglio.
Ciao Marco,
    suggerisco anche: "javascript e dom sulle tabelle":
http://pro.html.it/articoli/id_465/idcat_11/pro.html
Il primo esempio riprende "the table ruler" e estende l' area cliccabile
a tutta la riga.
Tornando allo script che hai proposto... l' idea č buona, ma cosě ad occhio
mi pare inaccettabile pensare di scandire il foglio di stile ad ogni onmouseover.
La pseudoclasse :hover verrebbe comodissima sui <li>, per esempio per
realizzare menů dropdown solo con i css. Ma in tal caso userei i behaviours,
che vedo cmq molto piů snelli della soluzione da te proposta, oppure un semplice
approccio javascript ad eventi.
Ciao,
    Alessandro Fulciniti

 
http://pro.html.it/articoli/id_465/idcat_11/pro.html
[cut]
l'hai fatto tu, ci credo!
-- 
blog: 
http://robiweb90.blogspot.com
e-mail: 
robiweb...@libero.it

 l'hai fatto tu, ci credo!
Ciao Robi,
    il motivo č un altro... come avrai potuto notare
raramente linkando un mio articolo dico che ne sono
l' autore. Quotando dall' articolo in questione:
"Un effetto rollover generalmente č associato a un link,
e l'utente č abitutato, quando vede una transizione di stato
di un elemento, a cliccarci sopra pensando che sia un link.
Per questo motivo, a parer mio, č altamente sconsigliabile
avere un effetto rollover su qualcosa di diverso da un link."
E nell' articolo viene mostrato come estendere l' area cliccabile
all' intera riga, se le righe della tabella contengono un link.
Questo č quanto.
una domanda un po' ot, ma dato che ci siamo ne approfitto:
come ti trovi con Blogger? E' facile da mettere su e aggiornare?
Si puň personalizzare il layout con i css oltre che usare i layout
predefiniti?
Ciao,
    Alessandro Fulciniti


mi trovo benissimo ed è supersemplice aggiungere un post. poi i template  
sono completamente personalizzabili, compresi css. se no come lo spieghi  
il modulo di ricerca in basso a destra? :-)
(idea copiata spudoratamente dal blog di lawrence)
e poi provare non costa niente :-P
ciao ciao!
-- 
Yum! E' anche meglio se usate la crema di formaggio invece del tofu. E  
zucchero. Un sacco di zucchero. E uova e burro: non dimenticate il burro.
Jeffrey Zeldman - Designing with web standards