Anchor points for states?

Jul 16, 2019

Hello and Good morning!

I was wondering if anyone could help me?

I'm using states to increase the size of an image and change its color when hovered.

However, the "anchor point" is always on the top left corner. My goal is to have the image expand from the center. I can't move the hover state or the normal state, or it'll look worse.

Is there a way to move that "Anchor Point?"

Here is a link to my example: https://360.articulate.com/review/content/073057f2-47fa-4f5b-8ad8-a4ee28fe8230/review

Attached is the story file for that page.

Example.story

4 Replies

David Schwartz

almost 5 years ago07/16/19 at 2:56 pm (UTC)

Hi Rei,

I was able to get a decent result by offsetting the anchor point on the hover state by -22,-28 pixels. I'm not sure why you said that moving the hover state would look worse.

Anyway, take a look.

Example_DS.story

almost 5 years ago07/16/19 at 3:03 pm (UTC)

Thank you so much for the reply!

Question: will those numbers work with objects of different sizes? Or will I have to keep offsetting objects by eye?

Whenever I moved it, for some reason it would keep defaulting back to top left. Maybe it's a bug. I'll give it another go in a different story file.

Thanks again. ^___^

David Schwartz

almost 5 years ago07/16/19 at 3:08 pm (UTC)

Those numbers wouldn't work for different sized objects, so you would have to offset by eye.

To be clear, the anchor point does always default to top left, but as you can go above and to the left of it, with the negative numbers, you can get the states to behave as desired.

Glad it's helpful!

Tom Kuhlmann
Staff

almost 5 years ago07/16/19 at 7:30 pm (UTC)

You could use the guides.

Create a cross hair with the guides.
Center the object.
Go the hover state and scale the object up.
Center the hover state to the guides.

Here's a quick video.

Anchor points for states?

4 Replies

This discussion is closed. You can start a new discussion or contact Articulate Support.