Using MouseOver to make a movie clip symbol appear

Community Beginner ,
Jun 01, 2021 Jun 01, 2021

Copy link to clipboard

Copied

Hello All, 

 

I am really struggling at the moment with an HTML5 project in Animate 2021. I cannot get ANY of my MouseOver or MouseOut events to work. My timeline is playing fine and the project stops on the slide I indicated and the eyes01 movie symbol is not visible, however that is where the successes end. 

 

I need the movieclip eyes01 to appear when you hover over Topic1 then disappear when your mouse leaves Topic1. I have eyes01 on a layer above the buttons if that makes any difference whatsoever. I have tried making images come up when you hover over Topic1, tried to get it to gotoAndPlay a different frame when you hover, absolutely NONE of them work. Grrr...

 

Here is my code, PLEASE HELP!

this.stop();

this.eyes01.visible=false;


var frequency = 9;
stage.enableMouseOver(frequency);
this.Topic1.addEventListener("mouseover", fl_MouseOverHandler_6.bind(this));

function fl_MouseOverHandler_6()
{
this.eyes01.visible=true;
}


var frequency = 9;
stage.enableMouseOver(frequency);
this.Topic1.addEventListener("mouseout", fl_MouseOutHandler_2.bind(this));

function fl_MouseOutHandler_2()
{
this.eyes01.visible=false;
}

 

Thank you for your assistance!

Views

354

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
community guidelines
Adobe Community Professional ,
Jun 02, 2021 Jun 02, 2021

Copy link to clipboard

Copied

Not sure why you post this in the Captivate forum. It is much easier in Captivate to create such a button, no need for JS. But you should post your question in the Animate forum. I will move it to that forum.

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
community guidelines
Community Beginner ,
Jun 02, 2021 Jun 02, 2021

Copy link to clipboard

Copied

So sorry! You are absolutely correct. I'm working in both programs simultaneously and just blanked on which one I needed.... 

Thanks!

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
community guidelines
Adobe Community Professional ,
Jun 02, 2021 Jun 02, 2021

Copy link to clipboard

Copied

Hi.

 

You don't need to repeat the enable mouse over call, but other than this your code is correct.

 

Does your Topic1 instance have a well-defined hit area? If you're not sure about it, would mind sharing your FLA?

 

Regards,

JC

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
community guidelines
Community Beginner ,
Jun 02, 2021 Jun 02, 2021

Copy link to clipboard

Copied

It does have a well defined border. I have drawn a rectangle over the text in the "hit" frame. Hmm.... Okay, thanks for checking the code. 

I'm trying to attach the .fla for you to look at but when I try to post it with the attachment, this error comes up and it won't let me, 

"Correct the highlighted errors and try again.

The attachment's td curated learning original.fla content type (application/octet-stream) does not match its file extension and has been removed."

Any ideas on what I'm doing wrong? 

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
community guidelines
Adobe Community Professional ,
Jun 02, 2021 Jun 02, 2021

Copy link to clipboard

Copied

Got it.

 

I think it's easier to upload your FLA to a file sharing service like Adobe Creative Cloud, Dropbox, Google Drive, or WeTransfer and post the link here if this is not a problem for you.

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
community guidelines
Community Beginner ,
Jun 03, 2021 Jun 03, 2021

Copy link to clipboard

Copied

Great, the link is https://shared-assets.adobe.com/link/30cc0b75-5045-4f5f-4a29-ddaccb349ed2

Two things should happen on frame 128. eyes01 and Title1RO should both appear when Title1 is rolled over. Neither are happening. I have tried making several things visible when different titles are rolled over and NONE of them work. It is driving me nuts! 

Any help you can provide would be greatly appreciated!

Thank you!

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
community guidelines
Adobe Community Professional ,
Jun 03, 2021 Jun 03, 2021

Copy link to clipboard

Copied

JoãoCésar is the right man to help you. He is a great coder. 


Multimedia Developer, Character Creator, and Animator.

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
community guidelines
Adobe Community Professional ,
Jun 04, 2021 Jun 04, 2021

Copy link to clipboard

Copied

Hi.

 

Sorry for the delay.

 

The problem is the leaves on the trees. They take up the whole visible area, so mouse events do not reach lower layer instances, even though the bitmaps have areas of transparency.

 

To solve the problem, you will have to import the leaves or any other bitmaps that are equal or similar in size to the opaque areas.

 

Or if you don't want to adjust the bitmaps, you can put them all in a single Movie Clip and set the mouseEnabled property to false.

 

Hope this helps and please let us know if you still need help.

 

Regards,
JC

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
community guidelines
Community Beginner ,
Jun 07, 2021 Jun 07, 2021

Copy link to clipboard

Copied

Just to check, could you please give me the exact code for mouseEvent false if it is for the movie clip FrontLeaves? 

 

Thank you!

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
community guidelines
Community Beginner ,
Jun 07, 2021 Jun 07, 2021

Copy link to clipboard

Copied

LATEST

Okay, I believe I have done what you suggested and put all of the bitmaps into a Movie Clip and set the mouseEnabled property to false. I have also changed it so that instead of a layer becoming visible when you hover over Topic1, Topics6-9 should no longer be visible. However, it is still not working. 

 

I am very sorry to take up so much of your time, but would you please have a look at it again to see what I'm doing wrong now? 

https://shared-assets.adobe.com/link/6f3a649a-8b79-4150-7779-0041ca933e8a

Thank you so much!

JS

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
community guidelines