javascript - setInterval 计时器需要在动画进度条上进行偏移

标签 javascript jquery

我有一个脚本:

http://jsfiddle.net/bXJhe/7/

jQuery(document).ready(function() {

    timer(10)

});

// Timer
var GLOBAL_TIMER;

function timer(intCount) {
    GLOBAL_TIMER = setInterval(function() {

        var intTickLength = 10;

        if (intCount < 10) {
            jQuery('#timer').html('00:0' + intCount--);
            jQuery('#bar').css('width', intCount * intTickLength + 'px');
        } else {
            jQuery('#timer').html('00:' + intCount--);
            jQuery('#bar').css('width', intCount * intTickLength + 'px');
        }

        if (intCount < 0) {
          stopTimer();
        }

    }, 1000);
}

function stopTimer() {
    clearInterval(GLOBAL_TIMER);
}​

我正在根据 intCount * intTickLength 设置进度条的宽度动画(也许有更好的方法?)

问题是,当计数器达到 1 时,条形图上的最后一个刻度消失了。我需要它一直保持到计数器达到 0。我需要某种偏移量。有什么想法吗?我不是 js 专家,但我渴望成为一名 js 专家。

最佳答案

在递减计数器之前设置条形尺寸:

jQuery('#bar').css('width', intCount * intTickLength + 'px');
jQuery('#timer').html('00:0' + intCount--);

关于javascript - setInterval 计时器需要在动画进度条上进行偏移,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12335030/

相关文章:

javascript - 我想使用 Jquery 或 Javascript 借助 for 循环和 ASC 顺序验证多个图像

javascript - SlickGrid AJAX 数据

javascript - 如何获取在下一个动态创建的 td 文本框中具有相同值的复选框的计数?

JavaScript 问题 : How do I duplicate user input into a hidden field?

javascript - 我们可以将样式表添加到 window.open 弹出窗口吗

javascript - 如果显示样式为无,则显示 div;如果显示样式为 block ,则隐藏

javascript - Select2 相关下拉列表

javascript - 使用 jquery 获取的 url 参数扩展 Accordion 菜单并将 attr 添加到所需的类

javascript - 我的位置的谷歌地图设置

javascript - 在 Node JS 中使用服务器发送事件未在客户端接收数据