Div con effetto

Salve a voi tutti , utenti di AV.

Scrivo questa discuzione per chiedervi un piccolo favore , ho bisogno di un codice presente nel tag <div> che quando mi passi sopra il mause il div mi esegue una class presende nel foglio css e quando il mause si leva dal div il div torni come prima , cioè quando la class non era attivata

lo saprete fare questo ?

se usi la pseudoclasse :hover nel css questo avviene in automatico, ma sappi che non è supportato da IE6<, quindi per esso dovresti (sei vuoi) ricorrere ad un javascript aggiuntivo.

Esempio:

Codice:

---

div.coneffetto {  background: yellow;  }
div.coneffetto:hover {  background: red;  }

---

Citazione:

---

Originalmente inviato da dreadnaut

se usi la pseudoclasse :hover nel css questo avviene in automatico, ma sappi che non è supportato da IE6<, quindi per esso dovresti (sei vuoi) ricorrere ad un javascript aggiuntivo. ...

---

Nel dettaglio:

Codice HTML:

---

<style type="text/css">
div.effetto_spento { ... gli stili in stato "spento" ... }
div.effetto_acceso { ... gli stili in stato "acceso" ... }
</style>
...
<div class="effetto_spento" onmouseover="this.className='effetto_acceso';" onmouseout="this.className='effetto_spento';">
...
</div>

---

Stammi bene...

Citazione:

---

Originalmente inviato da dementialsite

Nel dettaglio:

Codice HTML:

---

<style type="text/css">
div.effetto_spento { ... gli stili in stato "spento" ... }
div.effetto_acceso { ... gli stili in stato "acceso" ... }
</style>
...
<div class="effetto_spento" onmouseover="this.className='effetto_acceso';" onmouseout="this.className='effetto_spento';">
...
</div>

---

Stammi bene...

---

questo va con IE6 o suggessivo e con FF, se non va , come faccio a farli andare in tutte e due i browser ?

cmq , ora lo mi va, ma lo provato solo con FF

In teoria il JavaScript che ti ho scritto sopra dovrebbe funzionare con tutti i browser più recenti, a meno che ovviamente JavaScript non sia disabilitato.

Volendo potresti combinare gli script mio e di dreadnaut e "fregare" tra i browser, quelli che supportano correttamente CSS (tra cui, però, purtroppo non c'è IE6 con JS disabilitato...):

Codice HTML:

---

<style type="text/css">
div.effetto_spento { ... gli stili in stato "spento" ... }
div.effetto_spento:hover { ... gli stili in stato "acceso" ... }
div.effetto_acceso { ... gli stili in stato "acceso" ... }
</style>
...
<div class="effetto_spento" onmouseover="this.className='effetto_acceso';" onmouseout="this.className='effetto_spento';">
...
</div>

---

Stammi bene...