Question

如果鼠标光标没有超过以下两个ID，我想隐藏或toggle upwards DIV;

notifications和 notifications_show

我使用的HTML是：

<a href="javascript:void(0);" id="notifications">Notifications{$pm_alert_msg}</a>
<div style="display: none;" id="notifications_show" class="notifications_show">{$notifications}</div>

jQuery是：

jQuery(document).ready(function($){
    $("#notifications").on('click', function(){
        $('#notifications_show').stop().slideToggle("slow");
    });
});

但我不知道怎么做，如果光标不在上面提到的两个id上，那么div notifications_show应该向上或向上切换。

请帮忙！

Answer 1

尝试

jQuery(document).ready(function ($) {
    $("#notifications").on('click', function () {
        $('#notifications_show').stop().slideToggle("slow");
    });


    $('#notifications').hover(function () {
        var $target = $('#notifications_show');
        clearTimeout($target.data('hoverTimer'));
    }, function () {
        var $target = $('#notifications_show');
        var timer = setTimeout(function () {
            $target.stop(true, true).slideUp();
        }, 200);
        $target.data('hoverTimer', timer);
    });

    $('#notifications_show').hover(function () {
        clearTimeout($(this).data('hoverTimer'));
    }, function () {
         var $target = $(this);
        var timer = setTimeout(function () {
            $target.stop(true, true).slideUp();
        }, 200);
        $target.data('hoverTimer', timer);
    });
});

演示：Fiddle

如果鼠标光标不在它们上方则滑动幻灯片div

1 个答案: