javascript - 可拖动 - 如何限制可拖动元素越过屏幕底部?

标签 javascript jquery css plugins user-interface

我有一个只能通过 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();
            }
       }
    });
});

关于javascript - 可拖动 - 如何限制可拖动元素越过屏幕底部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13662141/

相关文章:

javascript - React router dom无法获取页面

javascript - 如何将 web 配置中的值读取到 vue js 代码中

jquery - 在通过 Ajax 请求提交之前使用 jQuery 进行表单验证

javascript - 即使响应是 200 ok,也可以访问 ajax 请求中的错误 block

javascript - jquery - 按名称访问表单输入字段

jquery - 如何在 NetBeans IDE 中实现 Jquery UI Themeroller

javascript - 可调整大小和可拖动的 div

javascript - 如何在命名空间: MobX内使用装饰器

javascript - 让 child 只在 parent 出现时出现

javascript - 是否可以仅通过 CSS 更改页面加载时特定元素的背景?