Scaled symbol throws out draggable symbol.

Any reason for the scaling to occur in the first place?

When its removed, the draggable/droppable works.

Darrell

Unfortunately this is a known issue with jQuery UI where drag and drop doesn't properly calculate the dimensions of scaled elements, and one they don't seem intent on fixing. I tried a bunch of hacks to get jQuery UI to work and each fell short

The good news is there is another solution using Greensock draggable.

See the example

Download the example

It's pretty simple to use too -- here's all the code I needed for compositionReady

var rect = sym.$("rect"); // Reference the object you want to drag 

Draggable.create(rect, {type:"x,y",
}); // Drag it!

You do need to be a member of the ShockinglyGreen club to get access to the draggable script, but could be worth the investment if this is a method you'll get a lot of use from. There's lots of other cool things you can do like give momentum to objects, "throw" them around, lock dragged object to coordinates, create spinners and other goodies.

Sarah

Yep, GSAP has an onDragEnd event which acts similarily to jQuery UI's drop method.

Uploaded another example where when the object is "dropped" it plays the symbol.

Sample

Download

var rect = sym.$("rect"); // Get the element we want to drag

Draggable.create(rect, {type:"x,y",
    onDragEnd : function(){
       sym.getSymbol("rect").play(); // Play the symbol when the drag ends - can be any event   
    }, 
});

Sarah

really helpful for drag with gs library. but how can i intercept mouse direction? example: go R direction = PLAY symbol. go L direction = PLAYREVERSE direction. tnx