jquery – 根据百分比将项目拖曳到遏制元素中

这是什么样子？

$( "#Box ul li" ).draggable({
    helper: "clone"
});
$( ".item" ).draggable({containment: ".door"});

$( ".door" ).droppable({
    accept: ":not(.ui-sortable-helper,.item)",drop: function( event,ui ) {
       $( "<div class='item'></div>" ).html(ui.draggable.find("img")).appendTo(this);
    }
});

用户拖动$(“#Box ul li”)元素并将其放在$(“.door”)元素上.并将它附加到$(“.door”)元素与$(“.item”)选择器.

我正在使用jquery UI – 可拖动拖放项目.那里没有问题.

这是实际的问题;

但是当您开始拖动元素时,该函数会更改元素的左上位置,top：10px left：10px
但是我想根据百分比将项目拖动到包含元素.它应该是
前10名％;左：10％.

任何想法如何做到这一点？

解决方法

我找到了一个解决方案

$( ".item" ).draggable({
  containment: ".door",stop: function( event,ui ) {
   $(this).css("left",parseInt($(this).css("left")) / ($(".door").width() / 100)+"%");
   $(this).css("top",parseInt($(this).css("top")) / ($(".door").height() / 100)+"%");
  }
});