Ever had the problem of having to build a site that needs to work in all aspects.
Most people forget about the high contrast mode for accessibility types.
High contrast is actually very simple to work out but in a small amount of code, but finding this took me a few hours of painful thinking as well as research.
Well better get back to it it's simple just detect if a background image is found on an element, simple well here is just a snippet of code which should help you out.
function highContrastMode() {
var header = document.getElementById("header");
if (header != null && (header.currentStyle.backgroundImage == null || header.currentStyle.backgroundImage == 'none')) {
// add high contrast style sheet here
} }
The element "header" has a background image assigned to it from a style sheet, normally you would have this check run at the loading of the page and will dynamically create an element and place a background image to this new element and then check.