Jump to content
Search Community

Proper use of Scope in Draggable

Brickyenne test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hello,

 

I'm using Draggable with onDragEnd and onDragStart events to perform some tasks. In order to complete the onDragEnd tasks I need some variables defined inside the onDragStart function be visible inside the onDragEnd function. I see that's the purpose of onDragStartScope but it's not very explicit on how actually do that.

 

Can you clarify this a bit more please?

 

Thank you, your help will be appreciated.

Link to comment
Share on other sites

I'm not quite sure how you are going to get a variable defined in 1 function to be accessible from another function. Regardless of whether or not Draggable is involved, variables defined within a function are only accessible within the scope of that function. 

 

From what I understand, the solution is to define your variable outside the onDragStart and onDragEnd functions as shown in this codepen: http://codepen.io/GreenSock/pen/nIAyg

 

(view in Chrome dev tools with console open)

 

Perhaps you can fork it or give us a better idea of how / what you are trying to accomplish. 

Link to comment
Share on other sites

Update: You could attach a value to the target element of the Draggable instance and this might be a better way for both callback functions to access the same value pertinent to the Draggable instance

 

http://codepen.io/GreenSock/pen/gHJkB

 

 

var box = Draggable.create("#box", {
  onDragStart: function() {
    console.log("start", this.target.counter)
    this.target.counter ++;   
  },
   onDragEnd: function() {
    console.log("end", this.target.counter)
  }
});




box[0].target.counter = 0;
  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...