Skyscraper Parallax - Drag Animation

[Paul]

This example uses the DragX and DragY variables to create a parallax effect. I hope you like it.

The interactions take place on the DragBall, a dynamic panel which contains the following events to move other dynamic panels.

OnDrag
Move DragBall with drag

OnMove
Move *DynamicPanel* by...
X: [[DragX / 5]]
Y: [[DragY / 5]]

The smaller number the drag variable is divided by, the greater the effect (more it moves). With this said, it would make sense that the objects you want to appear closer to you divide by a small number. The farther away objects have a bigger number.

Jakub of Axure Czech Users created this interaction, I took the concept and applied it to the skyscraper design.

See it Live

[rainbowboy]

A little confusion about the axure dragx function. With the drag continuing, the movable dynamic panel will hardly return to its original place.

[Paul]

If you wanted to return everything to their original place you could add an OnDragDrop to which moves the dynamic panels to the X,Y before drag.