Change select color of option elements

[Jesper]

Hi everyone,

 

This question has been asked many times, but after searching for more than an hour, I have not found a definitive answer to it: (How) Is it possible to change the select color on the options in a <select> menu from the system-blue to something else?

 

 

Thanks in advance,

 

Jesper

[darkfreaks]

change it how in javascript or in CSS  , you have given a vague  situation which could cover a different number of ways to do so. ???

[Jesper]

Either way is not really a problem, as JavaScript is required to be enabled by users anyways for this application.

[RichardRotterdam]

When(on which action) do you wish to change the color of the select?

[lonewolf217]

<style type="text/css">
   select {
      color:red;
   }
</style>

 

this will change the text of a SELECT dropdown to red. change it to whatever you want

[Jesper]

@ Dj Kat

I don't really care on which event it takes place, I just want to replace the system-blue when hovering over an option to be another color.

 

@ lonewolf217

As I described in my first post, I want to change the system-blue hovering color when you hover over an option .

[RichardRotterdam]

@ Dj Kat

I don't really care on which event it takes place, I just want to replace the system-blue when hovering over an option to be another color.

In this line you contradict yourself. You state you dont care on which event the color changing takes place. And then you say you want the color changing to take place on a hover event.

[lonewolf217]

@ lonewolf217

As I described in my first post, I want to change the system-blue hovering color when you hover over an option .

 

no, you didn't say anything about hovering

(How) Is it possible to change the select color on the options in a <select> menu from the system-blue to something else?

 

try this out

http://www.webdeveloper.com/forum/showthread.php?t=184033

[Jesper]

@ Dj Kat

I wasn't contradicting myself. The JavaScript even called doesn't have to be a hover event, I want to change the system-blue color that shows when you hover over an option.

 

@ Lonewolf217

Not excactly that, no, but I did describe it.

[RichardRotterdam]

@ Dj Kat

I wasn't contradicting myself. The JavaScript even called doesn't have to be a hover event, I want to change the system-blue color that shows when you hover over an option.

You still only mention a hover event. What other events do you have in mind. If you don't want to change anything on an event simply use CSS like darkfreaks mentioned.

 

What do you mean with system-blue btw

[Jesper]

I don't mean javascript or css-events with events, I meant just regular events in a general way. When I touch my touch-screen, that's also an event. When the visitor hovers the mouse over the option, I want it to have another overlay-color than the regular system-blue:

(check the color of the "Options..." field).

[Irate]

You can add an onchange event with JavaScript, like...

 

 

window.onload = function(){
 
for(var i = 0; i < document.all.length; i++) {
 
if(document.all[i].attachEvent) {
 
document.all[i].attachEvent('onchange',myfunction);
 
} else {
 
document.all[i].addEventListener('change',myfunction);
 
}
 
}
 
};

 

With that, you add an event listener for all HTML elements which fire onchange, just that you got to define myfunction, of course.