Appendix JS_C_A3

Requirement: All functionality is operable through a keyboard interface.

Details: Mouse actions must be paired with equivalent keyboard actions.

<p>
    <a id="demo" href="http://www.brothercake.com/">
        <img src="images/JS_C_A3-Default.jpg" 
            alt="A plastic toy bunny with dopey eyes and freckles,
                 wearing a shirt and a tie." /></a>
</p>

var link = document.getElementById('demo');
var image = link.getElementsByTagName('img').item(0);
 
var highlight = new Image();
highlight.src = 'images/JS_C_A3-Highlight.jpg';
 
function swap(state)
{
    image.src = 'images/JS_C_A3-' + state + '.jpg';
}
 
link.addEventListener('mouseover', 
    function(){ swap('Highlight'); }, false);
link.addEventListener('mouseout', 
    function(){ swap('Default'); }, false);
 
link.addEventListener('focus', 
    function(){ swap('Highlight'); }, false);
link.addEventListener('blur', 
    function(){ swap('Default'); }, false);