Scale/Animate jQuery拖放到DropPble時可拖動

我有一系列可拖動的圖像和一些可拖動的文件夾。我環顧網絡，找不到任何插件/代碼來創建一種效果，當可拖動的圖片被拖放到可拖拽的圖片上時，它會向下縮放到可拖拽區域並淡出。Scale/Animate jQuery拖放到DropPble時可拖動

基本上，類似於將圖標拖放到OSX中的文件夾時的情況。我試圖給用戶視覺反饋，該圖像已被添加到文件夾。

我應該補充一點，我不想從屏幕上刪除/移動拖動。我正在使用「克隆」來提供拖動正在發生的視覺反饋。

任何建議/代碼/想法？

UPDATE

曾爲多一點點，而在尋找jQuery中的clone（）。我已經提出了以下內容，但是克隆的位置似乎是非常隨機的。理想情況下，我希望在執行動畫時將克隆放置在可放置的位置。

$('#photoscontainer').append($(r.photos[i].thumbnailhtml).draggable({ 
           helper:"clone", 
           stop: function(event,ui){ 

            clone = ui.helper.clone(); 
            $(this).append(clone.addClass('inside-drop-zone').draggable({ 
              containment: '.drop-zone' 
            })); 
            clone.animate({ 
             opacity: 0, 
             width: "0", 
             height: "0" 
            }); 
           } 


          }) 
         );

來源

2012-07-01 David

你可以使用jQuery寫動畫：

function dropped(elementId) { 
    var jId = "#" + elementId; 
    $(jId).animate({ 
     width:'-=50', 
     height:'-=50' 
    },5000); 
    $(jId).fadeOut(); 
}

我希望這樣的事情是你所期待的。

來源

2012-07-01 20:52:00 Polyov

是的，我只是創建一個函數，並將其附加到'dragstop'事件 – elclanrs

@SomekidwithHTML這就是關閉，但我使用的克隆，並希望這會發生克隆.. – David

Scale/Animate jQuery拖放到DropPble時可拖動

回答

相關問題