gpt4 book ai didi

javascript - Jquery Draggable - center cursorAt Vertically

转载 作者:太空狗 更新时间:2023-10-29 14:39:53 25 4
gpt4 key购买 nike

我正在处理我的第一个 JQuery 项目,但遇到了一些障碍。我正在尝试允许对一组嵌套列表 (ul) 进行拖放重新排序。除定位外,一切正常。目标是使可拖动对象相对于光标垂直居中(水平移动受到限制),以便可以轻松删除嵌套在其中的元素的 li。这是相关的 JS:

$(function() {
$( ".organizerlink" ).draggable({ axis: "y",
containment:"#organizer",
scroll: false ,
helper: "original",
revert: "invalid",
cursorAt: { top: Math.round($(this).outerHeight() / 2)}
});

和 HTML:

<ul id="organizer">
<li class="organizerTarget">&nbsp</li>
<li class="organizerlink" id="dbid-1">Page
<ul><li class="organizerTarget organizerNewParent">&nbsp;</li></ul>
</li>
<li class="organizerTarget">&nbsp</li>
<li class="organizerlink" id="dbid-2">About
<ul>
<li class='organizerTarget'>&nbsp;</li>
<li class='organizerlink' id="dbid-3">Another Page<ul><li class="organizerTarget organizerNewParent">&nbsp;</li></ul></li>
<li class='organizerTarget'>&nbsp;</li>
<li class='organizerlink' id="dbid-4">Example<ul><li class="organizerTarget organizerNewParent">&nbsp;</li></ul></li>
</ul>
</li>
<li class="organizerTarget">&nbsp</li>
<li class="organizerlink" id="dbid-27">Stuff
<ul><li class="organizerTarget organizerNewParent">&nbsp;</li></ul>
</li>

一些我已经尝试过的东西:

  • 将 cursorAt 设置为 $(this).height() - 没有用,我猜 height() 拉入了 css 高度,但它们没有明确定义,所以它跳到 0
  • 将它设置为 outerHeight() 在 firebug 中给我一个错误“elem.style is undefined”

我知道 outerHeight 元素存在于 jquery 中,并且基于 API doc看起来它可以自动计算,即使 CSS 未定义,所以我认为这是正确的方法,也许 $(this) 只是寻找它的错误位置。

最佳答案

我还想在拾取可拖动对象后将它们居中。我的解决方案:

$(".dragme").draggable({ 
start: function(event, ui) {
$(this).draggable("option", "cursorAt", {
left: Math.floor(this.clientWidth / 2),
top: Math.floor(this.clientHeight / 2)
});
}
});

关于javascript - Jquery Draggable - center cursorAt Vertically,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5750302/

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