CSS e Jquery: selezionare una riga di una tabella al passaggio del mouse
This entry was posted on November 14th, 2008 and is filed under CSS, Grafica, javascript, jQuery.
L’altra volta vi ho parlato di come fare per creare una tabella con righe di colori alternati.
Oggi invece aggiungeremo un piccolo dettaglio al codice scritto l’altra volta; cioè permetteremo di evidenziare una riga della tabella al passaggio del mouse.
Se al mondo esistessero solo browser come Firefox, Opera, ecc non avremmo molto da faticare (e non solo in questo caso 
) ma purtroppo esistono browser come IE6 che tuttora è molto utilizzato e quindi avremmo bisogno anche di Javascript per renderlo cross-browser.
Il codice CSS necessario sarà il seguente:
tr:hover, .highlight { background-color: #ccc; }
mentre il codice Javascript da aggiungere dentro la funzione $(document).ready(…) per farlo funzionare anche su browser datati è il seguente:
$("tr").hover(
function() {
$(this).addClass("a");
},
function() {
$(this).removeClass("a");
}
);
Ora al passaggio del mouse la nostra tabella verrà evidenziata di colore grigio (orrendo come accostamento ma rende l’idea).
Benvenuto! Mi chiamo