使用悬停并单击 jQuery UI 选项卡？答案

【问题标题】：Using hover and click with jQuery UI tabs?使用悬停并单击 jQuery UI 选项卡？
【发布时间】：2023-04-10 19:50:01
【问题描述】：

我正在为我的 jQuery UI 选项卡使用以下代码：

$('#tabs').tabs({
    fx: { opacity: 'toggle', duration: 400 }}).tabs('rotate', 1000);
$("#tabs").hover(function() {
    $("#tabs").tabs("rotate",0);
},

function() {
    $("#tabs").tabs("rotate",1000);
});

$("#tabs").click(function() {
    $("#tabs").tabs('rotate', 0);
});

标签旋转正常，鼠标悬停时旋转停止。但是，“悬停”功能也覆盖了“点击”功能。如何在悬停时实现暂停，并在点击时完全停止旋转？

【问题讨论】：

标签： javascript jquery click hover jquery-ui-tabs

【解决方案1】：

试试这个

$('#tabs').tabs({ 
    fx: { opacity: 'toggle', duration: 400 }
}).tabs('rotate', 1000);

$("#tabs").hover(
    function() {
        $("#tabs").stop();
    },
    function() {
        $("#tabs").tabs("rotate",1000);
    }
);

$("#tabs").click(
    function() {
        $("#tabs").stop(true);
    }
);

【讨论】：

【解决方案2】：

就在一周前，我还在寻找同样的问题。现在我创建了一个extesion: Pause on Hover for jQuery UI Tabs Rotate

【讨论】：