HTML

<div id ="progressTime"></div>

引入相应的CSS文件和JS文件

<link rel = "stylesheet" href = "./index.css ">

用法和配置参数

$("#progressTime ").ProgressTime({

    container: "

    container ", // 容器ID名称            

    startTime: new Date(foxOne.formatDate(new Date(new Date().getTime() - dayTimestamp * 10), "YYYY / MM / DD 00: 00: 00 ")), // 开始时间：2000/10/20 00:00:00            

    endTime: new Date(foxOne.formatDate(new Date(), " YYYY / MM / DD 00: 00: 00 ")), // 结束时间：2000/10/30 00:00:00           

    currentTime: new Date(new Date().getTime() - dayTimestamp * 7), // 当前时间: 2000/10/25 00:00:00            

    delay: 1000, // 自动播放动画时间                                                       

    isNow: true, // 是否显示右侧回到当前时间           

    toPlay: true, // 渲染是否完成            

    animateFinish: true, // 动画是否完成           

    formatterDate: function(timer) { // 自定义时间格式              

        return foxOne.formatDate(new Date(timer), "YYYY年MM月DD日 ");

    },

    animateCallback: function(config) {

        // 动画完成回调          

    },

    callback: function(config) {

        // 单击事件回成回调      

    }

});