jQuery选项卡：鼠标悬停后发生过渡

Question

我正在使用此代码：

$(document).ready(function() { $("#tabs").tabs({ event: 'mouseover', fx: { opacity: 'toggle', duration: 'slow' } }) });

如果我有 FX 或鼠标悬停效果很好，但如果我将两者结合起来，选项卡内容会显示，然后淡入。有什么想法吗？

Answer 1

这里可能与 event 和 fx 存在轻微冲突，因为两者都会触发一些东西来“显示”内容。您需要禁用事件的“显示”回调，以便 fx 可以处理商品的展示（我认为这是它们相互碰撞的原因）。不知道如何开箱即用。

  $(document).ready(function(){
    $("#tabs").tabs({
      // fx: {
      //   opacity: 'toggle', duration: 'slow'
      // },
      event: 'mouseover',
      show: function(event, ui) {
        $("#"+ui.panel.id).fadeIn("slow");
      },
      select: function(event, ui) {
        $("#"+ui.panel.id).hide();
      }
    });
  });

但是你可以做一些“hack”，而不是让选项卡处理 fx，你自己通过事件回调来做。

希望这是洁净的，我是原型人。