Creating a pop up window in Animate

New Here ,
Jan 19, 2021 Jan 19, 2021

Copy link to clipboard

Copied

I am not familiar with Animate at all and want to create an interactive graphic.

I checked out the tutorial on interactive and animated infographics. In the video about buttons and pop-up windows is not explained how to create the pop-up window. Can someone explain this step by step?

 

That was the answer to another question:

this.button.addEventListener("click",buttonF.bind(this));
 
function buttonF(){
if(this.info.alpha<.5){
this.info.alpha=1;
} else {
this.info.alpha=0;
}
}

 

Unfortunately, I don't understand that either.

TOPICS
How to

Views

111

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 ,
Jan 19, 2021 Jan 19, 2021

Copy link to clipboard

Copied

create a new movieclip

name it infographic (which will be its symbol name in the animate library)

go to its timeline and create (on stage) whatever you want to display in your info popup

 

on the main timeline frame where you have your interactive graphic assign a hotspot (by creatng a button) and assign it an instance name, eg button_info

 

place the library symbol infographic on the main tiimeline stage (in its own layer so its easy to toggle visibility off and on) where you want it to popup.  in the properties layer, while it's selected, enter an instance name, eg info.

 

then in the actions panel add:

 

 

this.info.alpha = 0;
this.button_info.addEventListener("click",button_infoF.bind(this));
 
function button_infoF(){
if(this.info.alpha<.5){
this.info.alpha=1;
} else {
this.info.alpha=0;
}
}

 

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
New Here ,
Jan 19, 2021 Jan 19, 2021

Copy link to clipboard

Copied

Thanks for your help! I'll try this.

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 ,
Jan 19, 2021 Jan 19, 2021

Copy link to clipboard

Copied

LATEST

you're welcome.

 

p.s. keep us posted on your progress.

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