Jump to content
GreenSock

martis

Draggable 0.9.2 Not working?

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

Hey guys,

 

I downloaded the latest release and replace ONLY the draggable JS and my objects are not dragging now.

 

I replaced Draggable 0.9.0, any ideas why the new version is not working or has different setup?

 

Thanks

Link to comment
Share on other sites

Hi

 

Try replacing the rest of the files you're using as well, remember that Draggable depends on TweenLite and the CSS plugin.

 

Rodrigo.

Link to comment
Share on other sites

Thanks that seemed to work

Link to comment
Share on other sites

Right, the latest Draggable REQUIRES TweenLite and CSSPlugin 1.11.0. There were updates to those core pieces, like switching from storing rotational values as radians to degrees. Do don't just update your Draggable and try using it with old versions of TweenLite/CSSPlugin. Instead, update all your GSAP files.

Link to comment
Share on other sites

I got the draggable working by replacing all the other files... (I am using TweenMax)

 

I did notice one other thing... The object will not drag if I "grab" divs inside of the draggable object. I have to "Grab" the background of the draggable object. Was this a change?

Link to comment
Share on other sites

Do those divs have onclick events or something? One problem some people had with the old Draggable was that they wanted certain "clickable" things to remain clickable so that, for example, clicking on an <a> link or a button or an <input> or <textarea> didn't initiate dragging but instead allowed the default behavior in the browser. Imagine clicking an input field to start typing, but the field never received focus and instead your click initiated dragging. Not desirable in most situations. So in the new Draggable, it automatically checks to see if the clicked/touched element is an <a>, <input>, <textarea>, <button> or if it has an onclick or a data-clickable="true" attribute and if any of those conditions are true, it will essentially ignore the click/touch. 

 

You can specifically mark something as clickable (or not) by adding a data-clickable="true" or data-clickable="false" attribute. Maybe try adding that to your divs. Again, I assume they have an onclick or something that's interfering (just a guess). 

Link to comment
Share on other sites

They are just divs with embedded font inside of them... lemme try adding the data-clickable="false"

Link to comment
Share on other sites

It'd be super helpful if you could post a very simple codepen or jsfiddle that demonstrates the problem so that we can take a peek. 

Link to comment
Share on other sites

I will work on a fiddle, in the meantime here is my test page...

 

 

http://thegeminisociety.com/scroller/

 

Notice if you select the gray background it scrolls, but not the text contained within. I have no interactions setup that may interrupt the draggable.

Link to comment
Share on other sites

Ummm....that jsfiddle doesn't have any JavaScript. Maybe I'm missing something. 

Link to comment
Share on other sites

Ah yes, I think I see exactly the problem. Please try the attached update and let us know if it resolves things for you. It had to do with a regular expression evaluating as true when it should be false, and it was happening because you wrapped your element in a <span> tag (not that there's anything "wrong" with that, of course). Sorry about any confusion.

Draggable.js.zip

  • Like 1
Link to comment
Share on other sites

That fixed it, thanks so much for looking into it Jack!

  • Like 1
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.
×