Jump to content
Search Community

Draggable

Rhaffaele test
Moderator Tag

Recommended Posts

From the link you provided I'm seeing this:
p8GE6Qk.jpg

 

In the index page appears a picture of a woman but there is nothing draggable there neither.

 

Regardless of the content the codepen sample allow us to take a look at your code, play with it and try to figure and solve any possible issues.

Link to comment
Share on other sites

Just remove the position parameter in the drag end callback:

onDragEnd: function(e) {
  $("#drag1").removeClass("invisible");
  if (this.hitTest("#target2", "30%")) {
    tl
      .to(box, 0.1, { rotation: 15 })
      // in this instance no position or repeat delay
      .to(box, 0.1, { rotation: -15, repeat: 2, yoyo: true })
      .to(box, 0.1, { rotation: 0 }, "+=0.1");
    TweenLite.to(e.target, 0.2, { x: 0, y: 0, top: 0, left: 0 }).delay(0.5);
  }
  if (this.hitTest("#target1", "30%")) {
    TweenLite.to(this.target, 0.6, { opacity: 0, scale: 0 });

    TweenLite.to("#drag1", 0.6, { opacity: 1 });
  } else {
    TweenLite.to(e.target, 0.1, { x: 0, y: 0, top: 0, left: 0 });
  }
}

It seems that the position parameter is messing things up after the first run, also I don't see the need to state a repeat delay of  0 seconds, that is basically the default.

 

Finally you're using the same method on all the drag end callbacks, you can easily create one method and pass it directly to the callback. Take a look at this:

 

https://www.drycode.io/

 

Happy Tweening!!!

  • Like 3
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...