Click on an already clicked object. How to do this?


#1

I have a small rectangle (an icon of an article) that the user can click on to enlarge it (and read it). Then, I want this enlarged rectangle to scale down again on a second click.

When I assign a click on-action to scale it up, and a second click on-action to scale down, it just scales up and immediatley down.

How can I achieve the behaviour that I want.


Free Hype Templates
(๐•„๐•š๐•”๐•™๐•’๐•–๐• ๐”พ๐•’๐•ฃ๐• ๐•—๐•’๐•๐• ) #2

JavaScript would be one answer, but you might not need to code to solve this problem.

Basically, your timeline would have the followingโ€ฆ

  • The beginning
  • The animation of an expanding button
  • the stopping point of the animation (A timeline action pauses the animation)

On the very next frame, just put another timeline action โ€” so the timeline can be played in reverse.

Maybe Iโ€™ll make a template of this for the next Free Templatesโ€ฆ Free Hype Templates [New โ€œEclipseโ€ Template] ๐ŸŒž


#3

Hi Michael,

A free template would be dream, Iโ€™m a journalist, not a coder and unexperienced with JavaScript and Hype.
I think about what you described, perhaps I can build it on my own. I didn`t think about timeline actions.

Thanks


(๐•„๐•š๐•”๐•™๐•’๐•–๐• ๐”พ๐•’๐•ฃ๐• ๐•—๐•’๐•๐• ) #4

Hey, Iโ€™m a journalist too! At least, thatโ€™s what my degree says. HA!

Anyway, the template is done. It should be available on August 16, 2016. Thatโ€™s when it should automatically appear on photics.com.


UPDATE: Here it isโ€ฆ https://photics.com/free-template-tuesday-7-tumult-hype-capitals/


(Trey Yancy) #5

Create an invisible object that pops in front when you click the button. Then set an action for the invisible object that pops it out of the way and shrinks the enlarged item.


#6

I feel I may be stepping on toes here but I would suggest just 1 timeline with an animation of the rectangle growing and shrinking

  1. create a new timeline
  2. animate the rectangle over perhaps 1 sec to enlarge (enough to be able to read) and then shrink.
  3. place a pause at the 15 frame mark (.5 sec) at the end of the enlarge part
  4. Create an action on mouse click that โ€œcontinues the timelineโ€ so when you first click it plays to the pause and on the second click it continues to the end (the shrink). Remember to tick โ€œcan restart timelineโ€ so that it can play from the beginning the next time it is clicked.

enlargeElement.zip (43.6 KB)


(๐•„๐•š๐•”๐•™๐•’๐•–๐• ๐”พ๐•’๐•ฃ๐• ๐•—๐•’๐•๐• ) #7

There can be more than one solution to a problem. ยฏ\_(ใƒ„)_/ยฏ


(Greg) #8

Hi Dbear, Iโ€™m getting a error on opening your example file โ€œenlargeElement.zipโ€ - Beta 3.5.2 (258) has expired.


#9

Is it because the โ€œtemplateโ€ is trying to open a copy of the beta on your machine. Seems weird

Here is a copy that isnโ€™t a template to try

enlargeElement.hype.zip (38.1 KB)


(Greg) #10

That is strange, I dragged and dropped the template on Hypeโ€™s application icon and it opens without issue. I had to change it in the โ€œGet Info Windowโ€ as it was defaulting to Hype 3.5.2


#11

files of that โ€œtypeโ€ maybe setup to open using the Beta copy. If you right click the file and see what is says next to โ€œOpen withโ€.

You can change this behaviour by seeing the files information (โŒ˜i) and looking down to Open with. and choosing the right application to open that file type with. (you can choose change all too)

scratch that โ€ฆ just saw your update :slight_smile:


#12

Thanks to all for the help. I have to figure out what works for me.