Jump to content
GreenSock

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

Reinitialize trigger for draggable element

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

I have multiple elements that are being used as the trigger under one class. For example, the "dragHandle" class is my trigger:

 

<div class="dragHandle"></div>

<div class="dragHandle"></div>

<div class="dragHandle"></div>

 

<div id="draggableLayer"></div>

 

This is fine when it is first initialized. All three will drag the "draggableLayer." The problem is, I am dynamically adding more "dragHandle" elements, and they are not seen as triggers after Draggable has initialized on page load. I.e:

 

<div class="dragHandle"></div>

<div class="dragHandle"></div>

<div class="dragHandle"></div>

 

<!--  these 2 were added after page load, but don't work like the others do as a trigger -->

<div class="dragHandle"></div>

<div class="dragHandle"></div>

 

<div id="draggableLayer"></div>

 

I have tried disabling (and killing) and then enabling the Draggable after adding the the additional trigger elements, but that hasn't worked. Is there a way to destroy and reinitialize the Draggable? Or maybe another way to make it see the additional trigger elements I am dynamically adding?

 

Thanks!

Share this post


Link to post
Share on other sites

Hi and welcome to the GreenSock forums,

 

Draggable only finds the trigger elements upon creation. It doesn't ever re-search the DOM for items with matching selectors.

 

I'm pretty sure the only way to achieve what you want is to kill() the Draggable and create a new one.

 

 

If you need more help in doing that, please provide a simple CodePen demo that makes it easy to add new trigger elements to the DOM. 

http://greensock.com/forums/topic/9002-read-this-first-how-to-create-a-codepen-demo/

  • Like 1

Share this post


Link to post
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

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. 


  • Recently Browsing   0 members

    No registered users viewing this page.

×