带进度条的倒数计时器

Question

以下是我到目前为止：http://jsfiddle.net/BgEtE/

我想尝试这样的事情：http://fusionmedia.dk/construction/

我需要这样的进度条，我需要像他们一样显示日子。此外，我需要使用一个名为“Russel square”的字体作为计时器。我看了一遍，但遇到了麻烦。

Answer 1

对于您可以使用this one的计时器，您可以集成进度条，但我不太确定。

这是another great tutorial，您可以轻松调整以获得所需内容。

嗯，我不是专家，但并不是那么困难，请看看updated demo。请注意默认变量// def values

   var iCms = 1000;
    var iMms = 60 * iCms;
    var iHms = 3600 * iCms;
    var iDms = 24 * 3600 * iCms;  

这是您需要用来“安排”本节中的进度条：

// def options
        var aDefOpts = {
            start: new Date(), // now
            finish: new Date().setTime(new Date().getTime() + 5 * iMms), // now + 5 days

例如，如果你写... + 5 * iMms，那将是五分钟。 iDms => Days / iHms=> hours / iCms=> seconds。

另外看看我在演示中添加的css，我认为要使用自定义字体，首先必须将字体上传到服务器，然后使用类似这样的东西在样式表中添加字体：

@font-face{
font-family: myFont;
src: url('myFont.ttf');
}

@font-face{
font-family: myFontEI;
src: url('myFont.eot');
}

Then Attach it as a font family like so...

font-family: myFont, myFontEI;