gpt4 book ai didi

css - 防止在 Joint JS 中拖拽

转载 作者:技术小花猫 更新时间:2023-10-29 11:44:35 25 4
gpt4 key购买 nike

我正在研究 JointJS API。但是我想防止元素从它们的原始位置移动。你能建议我一些 JointJS 的特性或 CSS 的任何一般特性,我可以用它来使我的对象不可移动。

我不能在论文或 paper.$el.css('pointer-events', 'none'); 上使用 interactive: false option 因为我当鼠标悬停在元素上时需要具有突出显示功能。

请提出一种在允许其他功能的同时禁用元素移动的方法。相关CSS代码片段如下:

.viewport {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.element {
/* Give the user a hint that he can drag&drop the element. */
cursor: crosshair;
position: fixed;
}
.element * {
/* The default behavior when scaling an element is not to scale the stroke in order to prevent the ugly effect of stroke with different proportions. */
vector-effect: non-scaling-stroke;
-moz-user-select: none;
user-drag: none;
position: fixed;
}

最佳答案

interactive 选项还允许一个function 值。要仅允许与链接交互(更具体地说是 joint.dia.LinkView 实例),您可以这样做:

var paper = new joint.dia.Paper({
el: $('#paper'),
width: 400,
height: 400,
model: graph,
interactive: function(cellView, method) {
return cellView instanceof joint.dia.LinkView; // Only allow interaction with joint.dia.LinkView instances.
}
});

或者,您可以检查 method 参数。尝试拖动元素时,method 值为 pointermove,单击链接时为 pointerdown

希望对您有所帮助!

关于css - 防止在 Joint JS 中拖拽,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23885646/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com