Attributes.html already has two keyboard event triggers.  Make these changes:

Test it and it should work as before apart from not changing the colour back.  If not check your error console.

Now change the changeEmphasis function:

Test the page by pressing r, g and b as well as any one other key on the keyboard.  The messages you receive will not relate to what you are doing but they are a good test of the code so far.

The final step is to do something sensible with the three key presses:

Hopefully you can now see what will happen before you try it.  Work through the code if not.  Then try it to see if you were right (start by pressing g). 

If you are using some browsers there will be a problem (Firefox at least at the time of writing).  The colours will change but the browser also does something else as well.  This is because Firefox assumes that if you type while on a Web page you want to search for what you are typing.  To stop it add this line as the first line inside the changeEmphasis function:


Any event in a browser may have a default action.  This prevents the default action (start searching for the text) from happening.  Otherwise it will change the colour and then do the default as well.  You can use this to avoid default pop up menus on right click etc. but think carefully before you do as it might annoy the user.  One use is to make the copying of images from a page harder by disabling the ability to right click and copy.