当页面足够长,向下滚动一些之后,

在拖动时,被拖动的div会向下产生滚动距离那么高(scrolltop)的差距

鼠标位置距div顶部差距了正好页面scroll的距离,页面scoll越多差的越多。

解决方法参考:http://stackoverflow.com/questions/5791886/jquery-draggable-shows-helper-in-wrong-place-when-scrolled-down-page

 

$("#abc").draggable({
drag: function (event, ui) {
if ($.browser.chrome || ($.browser.msie && $.browser.version == 7)) {
ui.position.top -= $(window).scrollTop();
}
}
});

加上drag事件回调,判断浏览器,减去响应的高度即可

Jquery ui draggable在chrome和ie7下的bug的更多相关文章

  1. JQuery UI Draggable插件使用说明文档

    JQuery UI Draggable插件用来使选中的元素可以通过鼠标拖动.Draggable的元素受css: ui-draggable影响, 拖动过程中的css: ui-draggable-drag ...

  2. 让 jQuery UI draggable 适配移动端

    背景: 在移动端,本人要实现对某个元素的拖动,想到使用 jQuery UI 的 draggable 功能.但是发现此插件的拖动只支持PC端,不支持移动端. 原因: 原始的 jQuery UI 里,都是 ...

  3. jquery ui draggable,droppable 学习总结

    刚接触的时候,分不清draggable和droppable的区别,瞎弄了一会,其实很简单,draggable就是“拖”的功能,droppable就是“放”的功能. draggable()是被拖动的元素 ...

  4. ie6和ie7下z-index bug的解决办法

    一.匆匆带过的概念 关于CSS中层级z-index的定义啊什么的不是本文的重点,不会花费过多篇幅详细讲述.这里就简单带过,z-index伴随着层的概念产生的.网页 中,层的概念与photoshop或是 ...

  5. jQuery UI - draggable 中文API

    ·概述 在任何DOM元素启用拖动功能.通过单击鼠标并拖动对象在窗口内的任何地方移动. 官方示例地址:http://jqueryui.com/demos/draggable/ 所有的事件回调函数都有两个 ...

  6. JQuery UI - draggable(转)

    ·概述 在任何DOM元素启用拖动功能.通过单击鼠标并拖动对象在窗口内的任何地方移动. 官方示例地址:http://jqueryui.com/demos/draggable/ 所有的事件回调函数都有两个 ...

  7. JQuery UI - draggable参数中文详细说明

    概述 在任何DOM元素启用拖动功能.通过单击鼠标并拖动对象在窗口内的任何地方移动. 官方示例地址:http://jqueryui.com/demos/draggable/ 所有的事件回调函数都有两个参 ...

  8. jquery UI Draggable和Droppable 案例

    <html> <head><title>draggable</title> <script type="text/javascript& ...

  9. jQuery UI Draggable + Sortable 结合使用

    工作中需要将一个左边的设计好的控件,拖拽到右边的面板中,同时保持右边面板中的控件自由排序,这时候就需要及支持拖拽又支持排序的操作了, Demo截图:从左边控件拖到右边区域 代码段: <scrip ...

随机推荐

  1. ExceptionLess ASP.NET MVC 异常日志框架

    Exceptionless 一个开源的实时的日志收集框架,它可以应用在基于 ASP.NET,ASP.NET Core,Web API,Web Forms,WPF,Console,ASP.NET MVC ...

  2. WPF之坑——surface触控失灵之谜

    本次又遇到了WPF编写触控程序的一个问题,虽然已解决,但原因确搞不太明白,希望有大神看到这篇文章帮我解答. 在项目中实现了自己定义的icommandsource,因为需要对触控有特殊需求,控件对鼠标与 ...

  3. 国际化SEO优化的最佳实践

    作者:Kristopher Jones 翻译 :吴祺深 欢迎访问网易云社区,了解更多网易技术产品运营经验. 让我们来说一下hreflang属性.如果你还没有关掉这个页面,那么你已经完成了这个教程最重要 ...

  4. 对于equals和==的理解

    很多时候equals和==大家都分不太清楚怎么样来使用,今天小编就来教大家怎么使用 equals比较的是两个变量的值是否相等 而==则比较的是这个变量的内存地址是否相同 打个比方来说 String a ...

  5. 用 python 修改文件中指定的行数

    #! /bin/python filename='setup.ini' lines=[] with open(filename,'r') as f: lines=f.readlines() lines ...

  6. Django(出版社功能)

    day62 day62 2018-05-02  1. 内容回顾     Django         1. 安装             1. Django版本 1.11.xx            ...

  7. JavaScript基础DOM介绍和常用操作(5)

    day53 参考:https://www.cnblogs.com/liwenzhou/p/8011504.html JavaScript引入方式 location对象 window.location ...

  8. Android应用安全防护和逆向分析 ——apk混淆成其他语言代码

    现在很多人对于app的安全是越来越重视了,尤其是金融相关的行业,对于app的防范可是下足了功夫.各种加固,各种加密算法,层出不穷.我个人觉得,在安全技术这块,没有绝对安全的.也许今天这个技术起到了防范 ...

  9. jsp页面,jstl标签中的数据在<%%>java中使用

    可参考jsp的API隐式对象.. 这部分数据其实被保存在page域中,但jsp中如果使用java代码需要在特定的标签中<%%>,在这个标签中可使用的只有pageContext对象,所以可以 ...

  10. 在vue项目中使用swiper2.7.6

    $ npm install swiper@2.7.6 --save-dev npm WARN rollback Rolling back node-pre-gyp@0.10.0 failed (thi ...