Question

当标签或页面处于活动状态时，我有关于页面开始动画的简单问题。我的意思是当用户打开页面但开始浏览另一个网站，直到我们的网站加载。然后他点击我们的网站标签，然后点击动画加载。我在许多网站上都看过这个，但从来不知道这样做的诀窍。

演示转到：http://swiftideas.net/ 打开网站并转到另一个页面，当网站满载时，点击swiftideas网站。你会看到一个淡入淡出的效果，说“你好。我们是SWIFT的想法”和菜单呢！

但是当你来到这个页面时它就开始了。很聪明！任何线索如何实现这一目标？

我希望你的人也喜欢这个！

Answer 1

您可以使用窗口的focus和blur事件：

var interval_id;
$(window).focus(function() {
    if (!interval_id)
        interval_id = setInterval(hard_work, 1000);
});

$(window).blur(function() {
    clearInterval(interval_id);
    interval_id = 0;
});

回答“双火”的评论问题并保持jQuery的易用性：

$(window).on("blur focus", function(e) {
    var prevType = $(this).data("prevType");

    if (prevType != e.type) {   //  reduce double fire issues
        switch (e.type) {
            case "blur":
                // do work
                break;
            case "focus":
                // do work
                break;
        }
    }

    $(this).data("prevType", e.type);
})

标签/页面处于活动状态时启动动画

1 个答案: