如何解决jquery ui拖拽时拖到容器外会被覆盖问题

来源:互联网 发布:airpak软件下载 编辑:程序博客网 时间:2024/06/12 19:58

问题

jqueryui 在拖拽的时候如果在一个容器内拖拽,即不拖拽到父元素的外面的时候是没有问题的,但是如果想把某个元素拖到父元素的外面,就会发现一旦拖拽到容器外面就会被隐藏。

解决方案

自定义helper

$("#userViewTaskGrid .user-event").each(function(){$(this).draggable({zIndex: 999,revert: true,revertDuration: 0,helper: function(){var clone = $('<div class="ui-clone">' + $(this).html() + '</div>');clone.appendTo('body'); return clone;},containment: 'body', appendTo: 'body'});});

这样会把拖拽的元素的整体html都添加到ui-clone下面,所以我们在把原来元素(user-event)的css样式加到ui-clone上面

//下面是原来元素的样式.ui-clone{width: 200px;background: rgb(133, 203, 116);}

effevo技术团队出品 (https://effevo.com)
这里写图片描述

0 0