我创建了一个没有 UI 或其他插件的可拖动 div。但是有一个大问题是我不能制作可放置的 div。这是我的代码:
$(function() {
$(".dragIt").on("mousedown", function(e) {
var $dragIt = $(this).addClass('draggable');
var z_idx = $dragIt.css('z-index'),
dragHeight = $dragIt.outerHeight(),
dragWidth = $dragIt.outerWidth(),
positionY = $dragIt.offset().top + dragHeight - e.pageY,
positionX = $dragIt.offset().left + dragWidth - e.pageX;
$dragIt.css('z-index', 1000).parents().on("mousemove", function(e) {
$('.draggable').offset({
top: e.pageY + positionY - dragHeight,
left: e.pageX + positionX - dragWidth
});
});
e.preventDefault();
}).on("mouseup", function(e) {
$(this).removeClass('draggable');
});
});
我尝试了一些方法,例如:
if ( $('.dragIn').position() < $('.dropIn').position() ) {console.log('dropped');}
但它不起作用。有什么解决办法吗?感谢您的提前!