jquery - 标签滑出 - 如何让它在悬停时稍微动画（移动）？

Question

我正在使用这个tabSlideOut jQuery 插件来创建一个滑动选项卡。它按预期工作。但是，我想添加一个行为，当悬停选项卡时，滑块会稍微滑动。

我试图在悬停时添加这样的动画：

$("#contactTab").hover(function() {
    $("#contactContainer").stop(true, true).animate({
        "right": "+=45px"
    }, 300);
}, function() {
    $("#contactContainer").stop(true, true).animate({
        "right": "-=45px"
    }, 300);
});

- 但它出来有点摇摇欲坠...... 小提琴在这里。

有谁知道如何解决这一问题？

Answer 1

用#contactContainer 替换#contactTab：

  $("#contactContainer").hover(function() {
     $("#contactContainer").stop(true, true).animate({
          "right": "+=45px"
      }, 300); }, function() {
      $("#contactContainer").stop(true, true).animate({
          "right": "-=45px"
      }, 300); });

您的代码的问题在于，每次鼠标移出 A 元素时，块都会开始滑回原位。因此，当鼠标在白色 div 内移动时，块开始向后滑动。

通过将事件移动到全局 div 上，问题就消失了。