Firstly, I am assuming jQuery questions are submitted here as it based on Javascript. Apologies if I am wrong and please feel free to correct me.
Secondly I am seeking some code/app in jQuery; I don’t really understand that well, so when visitors have visual impairments they can select a stylesheet by just clicking a image icon depicting the colour change. Where is the best place to seek such coding/app?
Thirdly, would I be right in assuming the additional stylesheets only list the items that will be changed and not everything that’s in the main stylesheet?
The plan is to just change the colours for background and text, much like the BBC website has.
This could be as easy as adding/removing classes on the <body> element and in your CSS, just make rules inside of it . So adding an event listener to those icons to do this.
“jQuery to switch stylesheets for accessibility” is a bit of an oxymoron as many users who need accessibility functions will also have javascript switched off.
Well that me completely confused now What I was hoping to copy, to some degree, was the colour options on the BBC website bbc.co.uk/accessibility/best_Practice/policy.shtml# your can see on the top right various screen colour options.
You can define alternate stylesheets in the HTML - then when people using a browser that supports alternate stylesheets they can select the one they want from their browser menu.
For those using other browsers you can include a very simple JavaScript to allow which stylesheet is active to be changed. The plain JavaScript to do this is so short that there’s no reason for considering jQuery.
Many thanks to everyone who replied. The suggestions offered have given me something to play with and think about.
One thing I have learnt is that designing for accessibility is somewhat a nightmare, certainly not an easy task. One would have thought by now that modern browsers would have some form of filters that could be applied to change colours for visually impaired users?
Whilst I don’t have the technical skills I do know any photo can be quickly visually changed by applying filter/s, so why not apply the same technology to a webpage?
I got it to work very well with Firefox yet could not see how for Google chrome and Microsoft Edge. I did try and search Google to ascertain how and found nada!
I would be very happy to be enlightened how this can be achieved on the two aforementioned browsers, assuming you do know how?
But what happens if someone has the JavaScript switched off as gandalf458 wrote? I did write to the Royal National Institute for the Blind and not heard back from them yet.
One final question: your script I understand that we change the word (title) with it’s respective stylesheet name yet I have three additional stylesheets, so what lines within your code does not need to be repeated as I am assuming I don’t have to repeat all the code for each stylesheet?
Many thanks for your patience and time helping me out, very much appreciated,
Then provided the person is using an appropriate browser the code will still work without the JavaScript as the HTML is coded in such a way that browsers that allow stylesheet selection will offer all those in the list from the browser menu whether or not JavaScript adds an option to the web page itself to make the selection from there as well.