Come modificare le proprietà di una classe css con jQuery
La libreria jQuery mi permette anche di modificare le proprietà di una classe css in tempo reale. Basta indicare la classe nel selettore con il metodo css().
$('.nomeclasse').css()
Nel metodo css devo indicare la proprietà da modificare.
Un esempio pratico
Definisco un semplice foglio di stile nel documento html.
La classe .highlight evidenza mette in reverse il testo.
<html>
<head>
<style>
.highlight {
background:yellow;
}
</style>
</head>
<body>
<p class=highlight>Questa è una prova</p>
</body>
</html>
Quando apro la pagina con il browser, il testo nel paragrafo è evidenziato in giallo.
Questa è una prova
Per modificare le proprietà del colore di fondo (background) dal giallo al rosso, uso il selettore jQuery con il metodo css().
Uso lo stesso selettore anche per modificare in bianco il colore del testo.
$(".highlight").css({background:'red',color:'white'});
Ora il risultato in output è
Questa è una prova
E così via.
