Question

我有一个item1，它通过鼠标悬停显示/隐藏item2：

$(function() {
    $("#item1").hover(function() {
        $("#item2").show();
    }, function() {
        $("#item2").hide();
    });
});

我想在item1上的hover-in / hover-out中使用paralell中的随机时间延迟显示和隐藏item2。我怎么能这样做？

Answer 1

jQuery代码：

$(document).ready(function() {
    setInterval( function() {
        $("#item2").toggle('slow');
    }, 2000);
    $(function() {
        $("#item1").hover(function() {
            $("#item2").show();
        }, function() {
            $("#item2").hide();
        });
    });
});

在行动中 - ＆gt; jsFiddle - epeS4

Answer 2

根据您的需要增加并乘以随机数：

$(function() {

    var blocked = false;

    function divToggle() {
        if (!blocked) {
            $("#item2").toggle();
        }
        setTimeout(divToggle, Math.random() * 2000);
    };

    divToggle();

    $("#item1").hover(function() {
        blocked = true;
        $("#item2").show();
    }, function() {
        blocked = false;
        $("#item2").hide();
    });

});

DEMO

如何通过悬停和随机延迟显示/隐藏项目

2 个答案: