Newbie - can this be done easily - have no coding experience

[Belsen01]

Hi,

I'm very new to Animate and need to do a thing if its not too complicated.

I have 4 shapes that I convert to symbols and call them Shape1, Shape2, Shape3 and Shape4. These 4 symbols I want to be visible all the time in the same position.

When there is a click on Shape1 I want my symbol Txt1 to be shown next to Shape 1. When there is a click on another of the shapes I want the corresponding Txt2, Txt3 or Txt 4 to be shown. Only 1 of the textboxes may be visible at a time. 

Is this code something I can find online somewhere and copy paste and make my own adjustments after? Or maybe there is a video that shows to go about this - I have not been able to find this.

[JoãoCésar]

Hi.

One way to do this type of interactivity is to store the current displayed text field in a property or variable and everytime the user clicks on a shape we check for it and set the visibility to false. Like this:

var root = this;

root.showTextField = function(e, data)
{
	if (root.currentTextField)
		root.currentTextField.visible = false;
	
	data.textField.visible = true;
	root.currentTextField = data.textField;
};

root.shape0.on("click", root.showTextField, this, false, { textField: root.txt0 });
root.shape1.on("click", root.showTextField, this, false, { textField: root.txt1 });
root.shape2.on("click", root.showTextField, this, false, { textField: root.txt2 });
root.shape3.on("click", root.showTextField, this, false, { textField: root.txt3 });

Learn more about the on method here:

https://createjs.com/docs/easeljs/classes/DisplayObject.html#method_on

Please let us know if you need further assistance.

Regards,

JC

[Belsen01]

Thank you very much 🙂 - I will check it out.

Anita

[Belsen01]

Brilliant! It works 🙂 Thank you so very much for your big help.

Have a great weekend.

[JoãoCésar]

Great! You're welcome!

[Belsen01]

One more thing. What should I export as to use this on a WordPress site?

[JoãoCésar]

I don't have experience using WordPress but I guess you can publish as html and then embed the html using an iframe element.