在悬停延迟中添加延迟

时间:2014-08-28 16:44:03

标签: javascript jquery jquery-hover

我想为下面的代码添加延迟效果。我在jQuery中非常弱。

$(".home-furniture .menu > ul > li > a").hover(function(e){
    e.preventDefault();
    $(".home-furniture .menu > ul > li > a").removeClass("active");
    $(".home-furniture .menu > ul > li > .gallery").removeClass("active");
    $(".home-furniture .menu > ul > li > div .viewer-border").css({"left":"-9999em"});
    $(this).next().find(".viewer-border").removeAttr("style");

    $(this).addClass("active");
    $(this).next().addClass("active");
});

1 个答案:

答案 0 :(得分:2)

设置计时器以在所需的延迟后运行代码。假设您要取消暂停时的操作(此处显示为1000毫秒延迟):

        var id;
        $(".home-furniture .menu > ul > li > a").hover(function (e) {
            e.preventDefault();
            id = setTimeout(function () {
                $(".home-furniture .menu > ul > li > a").removeClass("active");
                $(".home-furniture .menu > ul > li > .gallery").removeClass("active");
                $(".home-furniture .menu > ul > li > div .viewer-border").css({ "left": "-9999em" });
                $(this).next().find(".viewer-border").removeAttr("style");
                $(this).addClass("active");
                $(this).next().addClass("active");
            }, 1000);
        },
        function (e) {
            clearTimeout(id);
        });