jQuery拖放到滚动div-拖放的元素不滚动
我有一个滚动div,其中包含许多div作为可拖动div的目标插槽。需要水平滚动此插槽容器以查看所有目标插槽 现在,当可拖动的元素被拖动到正确的插槽中,并且插槽容器被滚动时,被拖放的元素不会在div中滚动。有没有办法让被拖放的div在插槽容器中滚动jQuery拖放到滚动div-拖放的元素不滚动,jquery,jquery-ui,jquery-draggable,Jquery,Jquery Ui,Jquery Draggable,我有一个滚动div,其中包含许多div作为可拖动div的目标插槽。需要水平滚动此插槽容器以查看所有目标插槽 现在,当可拖动的元素被拖动到正确的插槽中,并且插槽容器被滚动时,被拖放的元素不会在div中滚动。有没有办法让被拖放的div在插槽容器中滚动 $('.draggable').draggable({ stack: '#drag_container div', revert: true }); $('.drop_target').droppable({ accept:
$('.draggable').draggable({
stack: '#drag_container div',
revert: true
});
$('.drop_target').droppable({
accept: '#drag_container div',
drop: handleDrop
});
function handleDrop(event, ui) {
var slot_number = $(this).data('number');
var draggable_number = ui.draggable.data('number');
if (slot_number == draggable_number) {
ui.draggable.css('cursor', 'pointer');
ui.draggable.draggable('disable');
$(this).droppable('disable');
ui.draggable.position({ of: $(this), my: 'left top', at: 'left top'});
ui.draggable.draggable('option', 'revert', false);
}
}
参见处的小提琴参见:
jsFiddle:
取代:
ui.draggable.position({ of: $(this), my: 'left top', at: 'left top'});
与:
$(this).append(ui.draggable);
$(ui.draggable).css("position","relative");
$(ui.draggable).css("top","0px");
$(ui.draggable).css("left","0px");
在if语句后添加此项(slot\u number==draggable\u number): 刚刚更新了fiddle Neat解决方案(我认为我应该想到这一点…)。非常感谢!
ui.draggable.appendTo("#drop_container");