jQuery UI Sortable/Draggable 导致窗口跳转

2023-12-29

在我的网页上,我有一个包含可排序 UL 的 div,每当我滚动到页面底部并拖动最后一个 LI 时,我的页面就会跳转,并且滚动条(在整个窗口上)会增长。

这是一个几乎解决了我的问题的 JSFiddle:www.jsfiddle.net/u5afykpf http://www.jsfiddle.net/u5afykpf。 要查看与我所发生的情况接近的内容,请滚动到底部并向下拖动最后一个元素。您将看到滚动条变大并移动。然而,在我的页面上,有更多的内容和高度,这会导致窗口发生变化,这是明显明显且不受欢迎的。如果你去jqueryui 可拖动演示 http://jqueryui.com/resources/demos/sortable/default.html,降低窗口高度并拖动最后一个元素,您会发现这种行为不会发生。

有没有人有 jQuery UI 可拖动和 CSS 建议的经验,他们可以给我阻止这种跳转发生?

我想做的一件事是给 UL 周围的 divposition: absolute但随后它就脱离了流程,布局变得完全混乱。


我很久以前就偶然发现了这个问题。尝试将以下参数添加到 .draggable 函数中

$('.selector').draggable({
    appendTo: 'body',
    containment: 'window',
    scroll: false,
    helper: 'clone'
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jQuery UI Sortable/Draggable 导致窗口跳转 的相关文章

  • 如何设置视频文件的预览,从输入类型='文件'中选择

    在我的模块之一中 我需要从 input type file 浏览视频 之后我需要在开始上传之前显示选定的视频 我使用基本的 HTML 标签来显示 但它不起作用 这是代码 document on change file multi video
  • 如何保留用户的输入打印?

    我正在尝试添加用户的评论 所以我只是尝试读取输入并将其发送以进行打印 但问题是 一旦我刷新页面或输入另一个输入 打印的输入就会消失 因此 即使刷新页面或重新输入新评论 我也希望始终保持所有用户的显示 代码 div div
  • 可以将position:absolute元素设为粘性吗?

    In CSS position sticky使元素能够显示position static行为 即 它采用文档流中的默认位置 直到到达某个滚动位置 然后采用position fixed行为 那么 这是否意味着我们不能使用position st
  • 删除特定数据表上的所有边框

    我需要使用 PrimeFaces 隐藏一个数据表的所有边框 而不是全部 我尝试了很多事情 但没有人奏效 有谁知道该怎么做 我已将以下样式 单独 应用于ui datatable class border hidden important bo
  • 如何找到div的第一个直接子元素

    这应该很容易 但我做不到 我有一个 id 为 LeftScrollableDiv 的 div 元素 我试图找到它下面的第一个子元素 LeftScrollableDiv first child div table table div 但结果为
  • 单击导航项锚链接时如何关闭切换菜单

    请看我的FIDDLE http jsfiddle net ayhpp8ax 我有一个带有 响应式 导航菜单 带有指向页面上元素的锚链接 的 1 页网站 当浏览器视口小于特定宽度 在我的情况下为 767px 时 使用此 javascript
  • jQuery,使用 ~ 作为 id 的一部分 - 如何?

    在我的应用程序中 我有一个表单 其中的元素使用特定的约定命名 即它们是路径 其各部分使用 sign 现在我需要通过 id 在 jQuery 中访问其中之一 但失败了 显然 jQuery 将其视为 prev sibling thing 有什么
  • 如何发送正确的授权标头以进行基本身份验证

    我正在尝试从 API 发布数据 但无法通过基本身份验证 I try ajax type POST url http theappurl com api v1 method data crossDomain true beforeSend f
  • 使用 AJAX 加载部分视图不起作用

    请原谅我 我是 MVC 和 AJAX 的新手 目前我只是提交一个表单 我想使用表单中的数据使用 ajax 更新部分视图中的表 My UserInfo部分视图如下所示 model IEnumerable
  • 如何在其他div id的悬停中使用div显示块

    如何打开div悬停时标记href tag 这是我在悬停 href 标签上显示 div 标签的代码 Services is id of href tag Services is id of div tag Service hover Serv
  • CSS 继承、别名和其他很酷的东西

    有一天 我随机浏览网页 发现了一些程序 可以让你编写 CSS 别名和其他很酷的东西 我现在不记得了 举个例子 我记得你可以这样做 myclass background color red greenfont 其中 greenfont 在其他
  • jqueryui tabs:当内容垂直滚动时是否可以保持导航选项卡可见?

    我的 jqueryui 选项卡集由几页相当长的内容组成 用户必须垂直滚动才能浏览每个文档 这是一个简化版本 MAIN TEXT END NOTES blah blah blah lots more text the end 如果用户正在阅读
  • 从 HTTP 登录到 HTTPS

    我的网站默认使用 HTTP 我确实有一个启用 HTTPS 的证书 但只有其上的某些区域强制建立安全连接 登录是通过 Ajax 处理的 我想开始使用 SSL 即使请求来自 HTTP 我尝试强制请求的地址具有 HTTPS 并且它完美地回复 然而
  • 删除 IE9 边缘周围的 2px 灰色边框

    我正在尝试对这个网站进行编码 尝试关键字 并且我正在尝试找出如何删除这个阴影2px灰色边框延伸到 IE9 窗口的内部 至少顶部 左侧和底部 我的边距设置为零 因此所有页面元素都到达页面的最边缘 但使用 IE9 它们会停在这个灰色边框处 我没
  • 如何通过单击链接来更改 div 的内容?

    这是我的网页的 修改后的 jsfiddle 它还有很多 而且定位是正确的 与此相反 http jsfiddle net ry0tec3p 1 http jsfiddle net ry0tec3p 1 a href class btn1 st
  • onclick 事件中未调用函数

    我想在每个 YouTube 链接的末尾添加一些 HTML 以在 litebox 中打开播放器 到目前为止 这是我的代码 document ready function var valid url new RegExp youtube com
  • -webkit-box-shadow 与 QtWebKit 模糊?

    当时有什么方法可以实现 webkit box shadow 的工作模糊吗 看完这篇评论错误报告 https bugs webkit org show bug cgi id 23291 我认识到这仍然是一个问题 尽管错误报告被标记为RESOL
  • 编辑第一个选项名称

    我有以下我无法访问的代码 我想要做的是将一些文本添加到现在为空的第一个选项中 诸如 选择地址 之类的文本
  • 如何使用 JavaScript 或 jQuery 克隆 HTML 元素的样式对象?

    我正在尝试克隆元素的样式对象 这应该允许我在更改后重置所述元素的样式 例如 el style left 50px curr style left 50px Modify the elements style The cloned style
  • 滚动顶部不符合预期

    Note 由于上次忘记奖励而重新开放赏金 A Woff 大师已经给出答案 我想在用户展开某一行时到达该行 这样当最后一个可见行展开时 用户不必向下滚动即可查看内容 I used example tbody on click td green

随机推荐