将溢出添加到div会阻止其内容正确拖动
将溢出添加到div会阻止其内容正确拖动
提问于 2013-03-15 03:50:20
我正在使用jquery FullCalendar插件，并将外部事件添加到日历中。
在this example中，一切都运行得很完美。但是，我有很多外部事件需要拖到日历上，所以我的事件列表需要滚动。
我补充道：
overflow-y: auto;到父div，这允许它滚动。但是，当将事件拖到父div之外时，这些事件将消失。
Here is a JSfiddle of what happens
我已经尝试了尽可能多的z-index和overflow组合，当它们离开父级时，它们一直在消失。
如何允许父div滚动并防止事件项在拖动时消失？
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-03-15 04:25:34
如果这是Draggable的初始化
$(this).draggable({
zIndex: 999,
revert: true, // will cause the event to go back to its
revertDuration: 0, // original position after the drag
scroll: false,
//INSERT HERE
});然后在//INSERT HERE行中插入以下选项之一：
选项1
helper: 'clone',
appendTo: 'body'这将按预期工作，但拖动的元素将在拖动时被克隆。
要避免这种情况，请使用下一个选项：
选项2
helper: function(event, ui) {
var clone = $(this).clone();
$(this).css({opacity:0}); //or $(this).hide()
return clone;
},
stop: function(event, ui) {
$(this).css({opacity:1}); //or $(this).show()
},
appendTo: 'body'See this Fiddle for an example。
如果你需要真正地“移动”元素(即它在被拖放后不再出现)，你需要在元素被拖放到合适的位置后对其执行remove()操作。您可以在Droppable的receive回调中添加一些删除原始元素的内容。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15424359
复制相关文章
相似问题
如何阻止内容溢出其容器？
如何阻止视频标签溢出其容器div。
如何阻止容器div允许内容溢出？
克隆Jquery可拖动对象也会拖动其原始内容
如果可滚动div溢出，Javascript会阻止滚动
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
社区富文本编辑器全新改版！诚邀体验～
全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验
腾讯云开发者
