How to call the drag events on the cloned element synchronously?

I've to drag the cloned element, but i don't understand how to call the trigger events synchronously

my example: http://jsfiddle.net/CfSMG/4/

c开发者_如何学运维orrect example: http://jqueryui.com/demos/droppable/#photo-manager

Up: Thx to all i've resolved the problem allready

---

My solution:

$('#move').mousedown(function(event) {
    var offset =  $(this).offset(),
        map = {
            position: 'absolute',
            top : offset.top + 'px',
            left : offset.left + 'px',
            zIndex : 100
        };

    if($('.foo')[0]) return this;

    $(this).clone().bind('mousedown mousemove', function(event) {
        var _this = $(this),
            offset = _this.position(),
            _event = event;

        $(document).bind({
             mousemove : function(event) {
                 var axis = function(i) {
                     var page = {
                         top : 'pageY',
                         left : 'pageX'
                     }[i];
                     return event[page] - (_event[page] - offset[i]) + 'px';
                 };
                _this.css({
                    left : axis('left'),
                    top : axis('top')
                }).unbind('mousemove');
              },
             mouseup : function() {
                _this.animate(map, function() {
                    $(this).remove();
                });
                $(this).unbind('mousemove');
             }
        });
    }).addClass('foo').css(map).appendTo('body');

    event.preventDefault();
    event.stopPropagation();
});

Live demo: jsFiddle