Supporting each other

Community forums

Welcome, Guest

Forum

Main Forum

Accessibility

Recreating accessibility options

Page:
1

TOPIC:

Recreating accessibility options 6 years 7 months ago #4996

Neil Pollock
Topic Author
Offline
Premium Member
Posts: 92
Thank you received: 4

I have a learning object where I've used a pseudo element to display a background image. This obviously breaks the colour change accessibility options (Remove Background Images, Invert, Black on Yellow).

I'm trying to figure out if it's possible to recreate these features, or to add some additional rules depending on which option has been clicked.

As a very rough proof of concept I put this together, which essentially does what I need: codepen.io/anon/pen/GxqZMV

However, I can't get this to work in an XOT object - it just doesn't seem to acknowledge any of the clicks to the colour change options in the same way.

Am I missing something obvious here? Is it even possible to change/add to the colour change options in this way?

Please Connexion or Create an account to join the conversation.

Last edit: by Neil Pollock.

Recreating accessibility options 6 years 7 months ago #4997

Fay
Offline
Elite Member
Posts: 229
Thank you received: 92

Hi Neil

I don't know exactly how you are putting this code in your Xerte project but at a guess I think the colour changer dialog doesn't exist at that point so it can't find the elements to attach your new code to.

The dialog doesn't get created until the colour changer button is clicked for the first time so you need to link your code to this first click. Try something along these lines to set it up:

var setUp = 0; // this makes sure that the change function is only set up once, even if colour dialog is opened several times
$x_colourChangerBtn.click(function() {
  if (setUp == 0) {
    setTimeout(function(){ // this just makes sure the dialog contents is ready
      $('#colourChangerOptions input[type=radio] name=colourChangerRadios]').change(function() {
        console.log(this.value); // put your code here - value will tell you which radio button is selected
      });
    }, 0);
    setUp = 1;
  }
});

The following user(s) said Thank You: Neil Pollock

Please Connexion or Create an account to join the conversation.

Recreating accessibility options 6 years 7 months ago #4999

Neil Pollock Topic Author Offline Premium Member Posts: 92 Thank you received: 4	That makes sense, and a quick test seems to work. Thanks!
	Please Connexion or Create an account to join the conversation.