2011-09-06 5 views
0

나는했습니다 복제 된 요소를 드래그합니다,하지만 난 기적복제 된 요소에서 드래그 이벤트를 동 기적으로 호출하는 방법은 무엇입니까?

내 예를 트리거 이벤트를 호출하는 방법을 이해하지 않습니다 http://jsfiddle.net/CfSMG/4/

올바른 예 : 최대 http://jqueryui.com/demos/droppable/#photo-manager

: Thx 모두에게 resolved 문제가 이미 있습니다.

+0

그래서 바로 여기에 어떤 문제가 있는지? 당신의 jsFiddle은 최소한 드래그, 복제 및 애니메이션으로 작동하는 것으로 보입니다. 다른 사람들이 당신의 작품과 "올바른"작품을보고 그 차이점을 파악할 것을 기대하지 마십시오. 자세한 내용과 함께 상세한 질문을하십시오. –

+0

해결책으로 자신의 솔루션을 제출하고 동의하지 않는 이유는 무엇입니까? 그렇게하면 비슷한 문제를 가진 다른 사람들이 무엇이 잘못되었는지 알 수 있습니다. –

답변

0

내 솔루션 :

$('#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(); 
}); 

라이브 데모 : jsFiddle

관련 문제