Jump to content
Search Community

onThrowUpdate

mimeartist test
Moderator Tag

Go to solution Solved by GreenSock,

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

  • Solution

Any particular reason you're using "left" instead of "x"? The logic would be a bit easier if it was "x" and you'd probably get better performance. Example: http://codepen.io/anon/pen/dPgypE?editors=001

 

Also, if you want them to move together, why not just wrap them in a <div> and apply the Draggable to that? Seems like it'd be a lot cleaner, especially in terms of applying bounds. 

 

To make your demo work, you could just add an onPress that kills the tweens of ".box" elements, as shown here: http://codepen.io/anon/pen/PwyoGP?editors=001but it seems to me like you'll still have to solve the bounds issue because you're applying your own movement logic to the "other" element and not preventing it from exceeding the bounds. It's certainly possible with some work, but I think it'd be WAY more elegant to just wrap things in a <div> and apply the Draggable on that. 

  • Like 3
Link to comment
Share on other sites

Thanks Jack,

 

The reason for not putting it in a div is because these panels actually appear both behind and infront of some other panels in one form of the site, so their z-index's  need to be easily adjusted.

 

I've gone down the road of everything being set with 'left' now, and changing to x is a possibility, but I'll need to adjust everything of what is a quite big complicated project (by my standards anyway), also not keen on having to reset everything all the time, as the panels have a lot of predetermined positions when in certain modes of the site. I'm basically pretty much building a WIMP environment.

Link to comment
Share on other sites

Understood, but you may find it easier and more efficient to just re-nest things on-the-fly in the DOM to get your z-index effect. In other words, group things in a single <div> that should be dragged together in the moment, and then return them to their original nesting in the DOM after the drag. Not sure if that's doable in your particular situation. Just an idea. 

 

Otherwise, you'll need to adjust the bounds for each Draggable to factor in all the other co-dragging elements. Again, totally doable, but tedious. 

Link to comment
Share on other sites

I've got it working pretty much, i've tried to avoid too much nesting, as I'm trying to track where things are as some of the elements are operating on their proximity to other things... I always find there are easier / better ways to do things after the fact, but I'm more comfortable with the logic in my head :)

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...