How to change shape properties with Javascript ?

[rvl]

I need to change the fill color of multiple shapes when rolling over a single shape and then revert to the original color when rolling out of the shape.  Can this be done with Javascript?  Seems like it should be very simple even without Javascript.   

There is not much reference information out there for accessing objects within a Captivate and using events to trigger actions.  Is there a DOM for Captivate?  Anyone have examples how to do this?

[TLCMediaDesign]

This code adds listeners when the cp object is ready:

var interfaceObj;
var eventEmitterObj;

window.addEventListener("moduleReadyEvent", function(evt)
{
interfaceObj = evt.Data;
eventEmitterObj = interfaceObj.getEventEmitter();
    initializeEventListeners();

});

function initializeEventListeners()
{
if(interfaceObj)
{
     if(eventEmitterObj)
  {
         eventEmitterObj.addEventListener("CPAPI_SLIDEENTER",function(e){  
   setPage();
            });
  }
}
}

function setPage()
{
 
document.getElementById("SmartShape_1").addEventListener("mouseover", setFill, false);
document.getElementById("SmartShape_1").addEventListener("mouseout", unFill, false)
}

function setFill()
{
var ss1 = document.getElementById("SmartShape_1c");
var ss1x = ss1.getContext("2d");
ss1x.fillStyle = "yellow";
ss1x.fill();
}

function unFill()
{
var ss1 = document.getElementById("SmartShape_1c");
var ss1x = ss1.getContext("2d");
ss1x.fillStyle = "#d3e8ff";
ss1x.fill();
}