CP9 HTML5 Run javascript during button Rollover state.

Update to previous message, I hope it helps anyone else who muddles their way through Javascript.

I needed a photograph to be shown in one part of the slide when the user hovered over a different area on the slide.

I initially thought I needed to use a ‘Rollover’ state of a button, but after seeing the code in the answer from TLC I experimented and found that it can be done with just a plain shape, which I named myTriggerShape, with no states.

So when the mouse is over myTriggerShape it will show the myPhotograph.

When the mouse moves away from myTriggerShape, the photograph will be hidden.

I created a shape named myTriggerShape, and made it transparent.

I placed a photo on the slide and named it myPhotograph and made it not visible.

I put the code below in the slide On Enter action.

// When the mouse is over the myTriggerShape, show my photograph.

document.getElementById("myTriggerShape").addEventListener("mouseover", myFunctionOver);

function myFunctionOver() {

cp.show("myPhotograph");

}

// When the mouse moves away from the myTriggerShape, hide my photograph.

document.getElementById("myTriggerShape").addEventListener("mouseout", myFunctionOut);

function myFunctionOut() {

cp.hide("myPhotograph");

}

Good Luck.

Peter