Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

Draggable

.getDirection()

.getDirection( from:String | Element ) : String

Returns the direction (right | left | up | down | left-up | left-down | right-up | right-down) as measured from either where the drag started (the default) or the moment-by-moment velocity, or its proximity to another element that you define.

Parameters

from: String | Element

Any of the the following can be used:

  • "start" (the default) – measures from wherever the drag began.
  • "velocity" (requires ThrowPropsPlugin!) – measures the moment-by-moment direction of the drag. For example, maybe the user dragged really far to the right, but then they start dragging to the left for a brief moment – it’s still to the right of the starting position, but it’s current velocity is moving to the left. That’s what “velocity” measures.
  • [element] – if you pass an element, it’ll return the direction from that element’s center to the Draggable’s center.

Details

Sometimes it's useful to know which direction an element is dragged (left | right | up | down | left-up | left-down | right-up | right-down), or maybe you'd like to know which direction it is compared to another element. That's precisely what getDirection() is for. You can pass any of the following as the parameter to control its behavior:

  • "start" (the default) - measures from wherever the drag began.
  • "velocity" (requires ThrowPropsPlugin!) - measures the moment-by-moment direction of the drag. For example, maybe the user dragged really far to the right, but then they start dragging to the left for a brief moment - it's still to the right of the starting position, but it's current velocity is moving to the left. That's what "velocity" measures.
  • [element] - if you pass an element, it'll return the direction from that element's center to the Draggable's center.

Video

Demo

See the Pen Draggable with direction sensing by GreenSock (@GreenSock) on CodePen.

Copyright 2017, GreenSock. All rights reserved. This work is subject to theterms of useor for Club GreenSock members, the software agreement that was issued with the membership.
×