Highlighted

Rollover triggering an action

Community Beginner ,
Sep 12, 2018

Copy link to clipboard

Copied

Hello,

I'm new to Captivate.

I'd like to create a button who will trigger an action when I rollover it... not when I click on it.

Is it possible with Captivate?

Views

102

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Rollover triggering an action

Community Beginner ,
Sep 12, 2018

Copy link to clipboard

Copied

Hello,

I'm new to Captivate.

I'd like to create a button who will trigger an action when I rollover it... not when I click on it.

Is it possible with Captivate?

Views

103

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Most Valuable Participant ,
Sep 12, 2018

Copy link to clipboard

Copied

Out of the box, Captivate has only one 'hover' event which could trigger an action. That is for the Rollover Slidelet. It is possible to create events with either the HTML widget by InfoSemantics or with JS.

However, hope you are aware of the fact the Rollovers will NOT work on any mobile device, only when a mouse is used which means a laptop or a desktop? Is it a good idea to use that event?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Engaged ,
Sep 12, 2018

Copy link to clipboard

Copied

Here's how you can do this using JS.  

1. Give the object the id hover

2. On enter frame execute the following javascript:

var obj = document.querySelectorAll("[id^='hover']")[1];

obj.addEventListener("mouseenter", function(e) {

//Add your action here. 

cp.alert('Object has been hovered over')

});

As Lilybiri has said, you probably want to have a click action as well for mobile devices.  

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Resources
Captivate User Guide
New Group