Example
More JavaScript...
I can see a lot of applications for this! Is this code that you can share?
Please find the attached .story file. I’ve created a simple example with two pictures and some JavaScript code. The idea is to create two shapes that match the initial dimensions and positions of the pictures — let’s call these the target start points. In the center of the slide, there’s another shape — let’s call this targets destination. Its width and height are designed to accommodate the scaled-up version of the pictures at a specific size. Imagine these shapes as placeholders. In this scenario, the two images scale up and down interchangeably, always returning to their initial positions and dimensions. When one image is scaled up, the other remains at its starting point, unscaled. Depending on your storyboard and layout, you may choose to combine code, states, triggers, and variables to achieve different effects. Lastly, while the code examples are slightly different — one scales the object up, and the other scales it back down to its original size (scale 1) — they can be copied and reused — just make sure to replace the two main object IDs with those from your own project, and ensure they match the objects currently present on the timeline. Different effects can be achieved by adjusting placeholder sizes, object dimensions, or object states within groups (as demonstrated in Example 2), as well as by modifying parameters in the code itself, such as animation speed or scaling. The possibilities are virtually endless. Tip: avoid altering clickable object hover state.