jQuery，滑动切换问题

当我的鼠标在div上时。测试我希望div.box出现在上方。使用滑动切换进行测试，以及当鼠标离开时。测试我希望.box再次滑动切换

它工作得很好，但当我移动鼠标在左上角的测试。它似乎不工作，我不知道为什么

我的css是：

.box{
    z-index:2;
    position: absolute;
}

还有我的jQuery：

box = function(el) {
    $('body').append('<div class="box"></div>');
    var box = $('.box:last');
    var posTop = el.offset().top;
    var posLeft = el.offset().left;
    box.hide().css({
        'left': posLeft,
        'top': posTop
 }).html('azerty<br>azerty<br>azerty<br>azerty<br>azerty<br>azerty<br>azerty').slideToggle(150);
}

boxStop = function() {
    var box = $('.box:last');
    box.stop().slideToggle(150, function() {box.remove();});
}

$(document).on('mouseover', '.test', function() {
    box($(this));
}).on('mouseout', function() {
    boxStop();
});

box=函数（el）{
$（'body'）。追加（''）；
变量框=$（'.box:last'）；
var posTop=el.offset（）.top；
var posLeft=el.offset（）.left；
box.hide（）.css({
“左”：左，
“顶部”：后期处理
}).html（'azerty
azerty
azerty
azerty
azerty
azerty
azerty'）。滑动切换（150）；
}
boxStop=函数（）{
变量框=$（'.box:last'）；
box.stop（）.slideToggle（150，函数（）{box.remove（）；}）；
}
$（document）.on（'mouseover'，'.test'，function（）{
方框（$（本））；
}).on（'mouseout'，function（）{
boxStop（）；
});

---

这里有一把小提琴：

盒子出现了，然后鼠标不再在div.test上，而是在div.box上

您可以将“指针事件：无；”添加到css中：

.box{
  z-index:2;
  position: absolute;
  pointer-events:none;
}

---

但这只适用于新浏览器。

框出现，然后鼠标不再位于div.test上方，而是位于div.box上方

您可以将“指针事件：无；”添加到css中：

.box{
  z-index:2;
  position: absolute;
  pointer-events:none;
}

---

但这只适用于新浏览器。

尝试将

.box

的z索引更改为-1，这样它就不会覆盖

.test

并阻止鼠标移动

.box{
    position: absolute;
    z-index: -1;
}

这是我的建议

编辑：由于负z索引将使元素位于所有其他元素之后（您可能不希望），因此您还可以定位

.test

，并确保其z索引高于

.box

.box{
    position: absolute;
}

.test {
    z-index: 1;
    position: absolute; /*could be relative or fixed too*/
}

---

然后，

尝试将

.box

的z索引更改为-1，这样它就不会覆盖

.test

并阻塞鼠标

.box{
    position: absolute;
    z-index: -1;
}

这是我的建议

编辑：由于负z索引将使元素位于所有其他元素之后（您可能不希望），因此您还可以定位

.test

，并确保其z索引高于

.box

.box{
    position: absolute;
}

.test {
    z-index: 1;
    position: absolute; /*could be relative or fixed too*/
}

---

而.

这是因为向下滑动的元素突然出现在鼠标指针所在的位置，并触发原始元素上的mouseleave事件，然后再次向上滑动，这是常见的错误。这是因为向下滑动的元素突然出现在鼠标指针所在的位置，这会触发原始元素上的mouseleave事件，它会再次向上滑动，这是常见的错误。谢谢，它工作得很好。你知道当鼠标放在盒子上的时候我怎样才能停止滑动切换吗？谢谢，它工作得很好。你知道当鼠标放在盒子上时，我怎样才能停止滑动切换吗？