1

我正在尝试这样做，每当有人点击我拥有的链接时，它都会打开一个新页面。打开页面后，我想要一个进度条和一个倒计时到零的计时器。

问题是，我只希望倒计时和进度条在窗口处于活动状态时倒计时/运行。当窗口/选项卡不活动时，我希望计时器/进度条停止。

我无法让它工作。我不知道我做错了什么。

这是我的代码：

var time = <?php echo $time; ?>
$(function() {
        $('#iframe').load(function() {
            startCounter();

            $('#iframe').unbind('load');
        });
    });
    var isActive = true;
    window.onfocus = function() { isActive = true; };
    window.onblur = function() { isActive = false; };



    function checkfocus() {
        if(isActive = true){
            time=time-1;        
        } else {

        }   

    }
    function startCounter() {
        $('#counter').fadeOut('fast');
        setTimeout("$('#counter').fadeIn('fast')",1050);
        setTimeout("runCounter()",1000);

    }

    function runCounter() {

        if(time==0){
            $('#counter').html('<button class="butn blue" onclick="<?php echo $creditButtonName; ?>();">Click here to get credited!</button>');
        }
        else {
            $('#counter').html('You must view this advertisement for ' + time + ' more seconds!');
            startBar();                                                                     
            setTimeout("checkfocus()", 1000);   
            setTimeout("runCounter()",1000);

        }


    }


function startBar(){
    $('#bar').animate({
        width:'100%'
    }, <?php echo $time; ?>000);
}

此时计时器将倒计时。当窗口不活动或任何东西时不会停止。

我的另一个问题是：我该怎么做才能使进度条在窗口不活动时也停止动画，然后重新开始？

4

0 回答 0