jQueryUI问题：为什么元素在屏幕上飞来飞去？

是的，我知道这个标题听起来有点可疑。我会尽我所能解释这件事

下面的代码应该有蓝色的

div

滑到红色的

div

旁边。（直接在右边-使用jQuery UI的

position（）

实用程序）第一次点击

显示div

按钮时，它就工作了。此外，

隐藏div

也可以工作

然后，当我再次单击以显示

div

时，它会显示在应该位于的右侧！这是为什么

注意：您可以找到该代码的一个实例

演示
#红色的{
背景色：红色；
宽度：200px；
高度：150像素；
位置：绝对位置；
}
#蓝色的{
背景颜色：蓝色；
宽度：150px；
高度：200px；
位置：绝对位置；
显示：无；
}
#测试仪1{
顶部：300px；
左：300px；
位置：绝对位置；
}
#测试仪2{
顶部：350px；
左：300px；
位置：绝对位置；
}
函数Show（）
{
$（'#蓝色'）。位置({
共：$（'红色'），
我的‘左上’，
位于：'右上'}）；
}
函数Hide（）
{
$（“#蓝色”）.hide（）；
}
显示div
藏起来

看起来您正在尝试使用jQuery UI位置，但您没有引用它

我不知道你的电脑的参数是怎么回事。
试着把它削减到最低限度

   function Show()
    {
        $('#blue').slideDown();
    }

它会起作用的

编辑

基于其他评论，请尝试以下操作

$(function(){
   $('#blue').position({
            of: $('#red'),
            my: 'left top',
            at: 'right top'})
})
function Show()
{
    $('#blue').slideDown();
}

function Hide()
{
    $('#blue').hide();
}

---

尝试重新设置蓝色分区。。。我这样做了，现在它似乎在Chrome和IE上工作

function Hide()
{
    $('#blue').css({ left: 0, top: 0 }).hide();
}

当元素被隐藏（使用display:none）时（直接或通过jqueryui）所做的任何测量都将产生0。如果您假设元素是可见的，那么这可能会导致有趣的结果

---

在您的示例中，当元素不在显示列表中时，您正在定位该元素，然后执行

slideDown（）

，这就是导致问题的原因。

在Firefox 3.6上运行良好，但在IE8上不起作用。我在代码中找到的唯一js脚本就是jQuery.js。你怎么能说它是jQuery用户界面？？？请引导我，我迷路了…@Reigel:对不起。。。原因是我复制并粘贴了提供

position（）

的小4kb jQuery UI，并将其粘贴到

jQuery.js

的末尾。现在已修复问题。请尝试包含整个内容，而不是复制粘贴部分内容。你永远不知道。这在完整的jQuery UI中是可以复制的，所以这不是问题所在。jQuery站点上的

position

演示似乎有问题，我不确定我是否会使用它：（事实上，出于同样的原因，我没有使用太多jQuery UI）。对不起，我忘了提到问题的关键是蓝色的

div

应该就在红色的

div

旁边。此示例使用jQuery UI。它不是一个bug。。。只是每次单击时您都在调用

.position（）

。。。这就是为什么。。。并且

.position（）

根据其当前位置进行初始化…是的。不，原因是我复制并粘贴了提供

position（）

的小4kb jQuery UI，并将其粘贴到

jQuery.js

的末尾。我能看到混乱的地方…是的，我现在明白了。那么，这不是问题所在。

$(function(){
   $('#blue').position({
            of: $('#red'),
            my: 'left top',
            at: 'right top'})
})
function Show()
{
    $('#blue').slideDown();
}

function Hide()
{
    $('#blue').hide();
}

function Hide()
{
    $('#blue').css({ left: 0, top: 0 }).hide();
}