How To Change the color of disabled html control in iexplore?

Question

input[disabled='disabled']
{
    background-color:#FFFBF0;
    color: #28B51D;     
}

I am using this example but that is not run in iexplore. But also run in other browsers.

If any body know then please tell me that how to change the color of disabled html control in iexplore.

Answer 1

Since you tagged your question as javascript, here is my advice for IE : include an ie-only script with an ie-triggering html comments, that adds a ie-disabled class to every disabled input. If the status of inputs can change after the initial page load, add a timed observer to your page that sets the class properly.

input[disabled], input.ie-disabled
{
    background-color:#FFFBF0;
    color: #28B51D;     
}

javascript file, included with conditional comment:

function checkDisabled() {   
  var inputs = document.getElementsByTagName('INPUT');
  for(var i=0, l=inputs.length; i<l; i++) {
    if(inputs[i].disabled) {
        if(inputs[i].className.indexOf('ie-disabled')==-1)
      inputs[i].className = inputs[i].className+' ie-disabled';
    } else {
      inputs[i].className = inputs[i].className.replace('ie-disabled', '');
    }
  }
}


setInterval(checkDisabled, 1000); // check every second

Here is a test (for IE). Note that the color css attribute is ignored by IE for disabled inputs. If you really need a green text, use readonly instead of disabled.