![](/img/trans.png)
[英]How do you prevent jQueryUI's draggable interaction from going past a certain offset on the page?
[英]Draggable - How to restrain draggable element from going past the bottom of screen?
我有一个只能在Y轴上拖动的元素。 我希望它能够超过屏幕顶部(可以),但禁止它越过屏幕底部。 我在jQuery Draggable API中阅读了有关遏制的信息,但没有找到关于我所问问题的答案,或者至少不了解如何将其应用于我的案例。 到目前为止,这是我的代码:
JavaScript:
$(document).ready(function() {
$("#elem").draggable({
axis: "y"
});
});
必须有更好的方法,但是;
$(document).ready(function() {
$("#elem").draggable({
axis: "y",
drag: function(event, ui) {
if($(this).offset().top + $(this).outerHeight() > $(window).height()) {
$(this).offset({"top": $(window).height() - $(this).outerHeight()});
event.preventDefault();
}
}
});
});
您需要将containment选项设置为页面的高度。
$(document).ready(function() {
$("#elem").draggable({
containment: "document",
scroll: false,
axis: "y"
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.