我一直在使用jQuery 1.4.2和jQuery UI 1.8.5来创建可拖动的元素,这些元素可以恢复到原来的位置.但是有一个问题;当您滚动浏览器窗口时,开始位置将更改为从更高的位置开始.它看起来像是使用绝对位置,但是没有考虑滚动的数量,但我不能确定.我在FireFox中完成了所有开发和测试.
这是我录制的关于此的短视频.. http://www.youtube.com/watch?v=KPW4ljpjuF8
JavaScript初始化代码如下所示..
$( '.frameworkNavigationItem' ).draggable({
appendTo : 'body',revert : 'invalid',containment : 'body',zIndex : 999
});
其中一个元素的HTML看起来像这样..
这就是CSS随之而来的.
.frameworkNavigationItem
{
background-color : #CACACA;
height : 20px;
line-height : 20px;
margin : 2px 0;
vertical-align : middle;
}
.frameworkNavigationItem:hover
{
background-color : #BABABA;
}
.frameworkNavigationItem:hover input,.frameworkNavigationItem:hover select
{
background-color : #BABABA;
}
.frameworkNavigationItem input,.frameworkNavigationItem select
{
background-color : #CACACA;
border : 0;
font-size : 10px;
}
.frameworkNavigationItemColor
{
background-color : #DADADA;
}
.frameworkNavigationItemColor input,.frameworkNavigationItemColor select
{
background-color : #DADADA;
}
.frameworkNavigationItemName
{
float : left;
height : 15px;
padding-left : 5px;
}
.frameworkNavigationItemDisplay
{
float : right;
text-align : right;
width : 48px;
}
.frameworkNavigationItemController
{
float : right;
width : 160px;
}
.frameworkNavigationItemController input
{
width : 150px;
}
.frameworkNavigationItemChild
{
float : right;
width : 160px;
}
.frameworkNavigationItemChild select
{
width : 150px;
}
请帮帮我!我不知道为什么会这样.
最佳答案
这里全面回答:
jQuery draggable shows helper in wrong place after page scrolled
jQuery draggable shows helper in wrong place after page scrolled
这是对我有用的修复:
确保父元素(如果它是正文的事件)有溢出:auto;组.我的测试显示此解决方案修复了该位置,但它禁用了自动滚动功能.您仍然可以使用鼠标滚轮或箭头键滚动.