Question

我有以下jQuery插件：http://jqueryfordesigners.com/slide-out-and-drawer-effect/

现在的问题是：当鼠标悬停在元素上方时，我想关闭活动的'抽屉'。 jQuery设置为保持活动状态打开，直到鼠标悬停应用于另一个抽屉元素。如果没有悬停在任何抽屉上，我如何关闭所有抽屉？

初始化代码：

$(function () {
    $('UL.drawers').accordion({
        // the drawer handle
        header: 'H2.drawer-handle',

        // our selected class
        selectedClass: 'open',

        // match the Apple slide out effect
        event: 'mouseover'
    });
});

此外，当我将'open'类应用于抽屉元素css（.drawer-handle.open {}）时，活动抽屉柄不会改变颜色（动画）。这是为什么？我在Joomla 1.7中使用PHP

谢谢！

Answer 1

以下是您的部分解决方案：

$(function() {
    var $accordian = $('UL.drawers').accordion({
        // the drawer handle
        header: 'H2.drawer-handle',

        // our selected class
        selectedClass: 'open',

        // match the Apple slide out effect
        event: 'mouseover',

        // allow all drawers to be closed (default is "true" - always keep a draw open)
        alwaysOpen: false
    }).activate(false);

    $('UL.drawers').mouseout(function () {
        // close all the drawers when the mouse leaves the parent list
        $accordian.activate(false);
    });
});

我说部分是因为这个设置的行为不像我想的那么顺利，但如果结果接近你想要的结果，那么应该让你开始朝着正确的方向前进。

您可以通过此jsFiddle查看它：http://jsfiddle.net/gKNGh/1/

jQuery：当鼠标没有结束时隐藏'活动类'

1 个答案: