colore testo di una <select>

[raffaele75]

ciao a tutti,
ho questo problema con firefox: la riga "pippo" mi si visualizza in nero una volta che l'ho selezionata, solo se apro la tendina si vede in rosso, e se la riseleziono rimane comunque in nero.. stessa cosa con lo sfondo, ecc....
come posso fare? ho bisogno che se la select è su off si visualizzi in rosso...

<select name="status">
<option>on</option>
<option style="color:#FF0000">off</option>
</select>

grazie

[Mich_]

Anzitutto non mi risulta che si possa definire uno stile per il tag <option>. La sintassi da te segnalata credo sia una estensione di qualche browser.

Se interpreto giusto, a te serve cambiare la formattazione di un certo tag in base al suo contenuto.
La cosa e` possibile SOLO con l'ausilio di un po' di JS. Esempio:

<select name="status" onchange="this.style.color=this.selectedOption?'#0 00':'#f00';">
(supponendo che la select deva essere nera alla prima opzione e rossa nelle altre)

[raffaele75]

grazie dell'aiuto...
in IE funziona benissimo, in firefox mi visualizza il colore solo quando apro la tendina...

[Mich_]

Sono un po' arrugginito con il JS.
Ho sbaglaito la sintassi. Ecco quella corretta:
<select name="status" onchange="this.style.color=this.selectedIndex?'#00 0':'#f00';">

Questo cambia solo il colore a tendina chiusa; puoi lasciare gli stili nell'option, sapendo pero` che potrebbe non essere visualizzato in qualche brwoser.

[raffaele75]

il problema è che queste tendine stanno su un calendario, e quando ti si apre la pagina tutte le date "off" devono far vedere la tendina rossa, tutte le date "on" la tendina nera, in modo da distinguerle a colpo d'occhio...
con quello stile cambiavo solo l'elemento selezionato con una if, ora sta diventando più complicato...
il js funziona, ma solo quando cambi la tendina, non quando carica la pagina...

[Mich_]

Nessuno ti vieta di mettere anche uno stile nel <select>, oltre che il JS:
<select style="color:..." onchange="...">

Certo che se e` una cosa estesa, il JS in linea e lo stile in linea non sono adatti: meglio una funzione esterna (nel file JS) e lo stile nel file CSS.

E attento anche a cosa succede nel caso JS sia disabilitato o non funzionante: se e` una cosa solo cosmetica non e` un problema; se invece e` informazione necessaria devi pensare ad un'alternativa.