HTML5进度条在另一个选项卡中暂停

时间:2014-02-08 04:58:43

标签: javascript jquery html

我的进度条加载器用于在Javascript中加载我的页面时显示一个秒数,这有点麻烦。

如果我点击另一个标签计数它会暂停,只有当你回去时才会恢复。 即使你在另一个标签中,我怎么能让它计算呢?

$(document).ready(function() {
        if(!Modernizr.meter){
            alert('Sorry your brower does not support HTML5 progress bar');
        } else {
            var progressbar = $('#progressbar'),
                max = progressbar.attr('max'),
                time = (800/max)*10,    
                value = progressbar.val();

            var loading = function() {
                value += 1;
                addValue = progressbar.val(value);

                $('.progress-value').html(value + '%');

                if (value == max) {
                    clearInterval(animate);     $(".demo-wrapper").remove();   $("#details").fadeIn("slow");     $("#motion1").html("Report for Registration.");        $("#motion").remove();   
                }
                    if (value == 1) {
                        $("#motion").html("Loading Page..");   
                }
                      if (value == 86) {
                        $("#motion").html("Connecting..");   
                }
            };

            var animate = setInterval(function() {
                loading();
            }, time);
        };


    });

以下是http://jsfiddle.net/w977Q/

的示例

2 个答案:

答案 0 :(得分:0)

也许看看这里接受的答案:How can I make setInterval also work when a tab is inactive in Chrome?

看起来这基本上是浏览器不希望在未关注的标签上使用处理能力的功能。

答案 1 :(得分:-1)

希望这可以帮助你

setInterval('yourFunction();', 1000); // this will work even on other tab

setInterval(yourFunction, 1000);      // this will run only if on current tab