使用方法

1.先引入样式和js

<link rel="stylesheet" type="text/css" href="css/timePlay.css"/>

<script src="jquery/jquery-1.10.2.js"></script>

<script src="js/timePlay.js" type="text/javascript" charset="utf-8"></script>

2.写一个时间轴容器

<div id="timePlay"></div>

3.调用插件

var timeplay = new TimePlay({

    speed: 2000, //播放速度

    startDate: 20180701, //开始日期

    endDate: 20190131, //结束日期

    timeUnitControl: true, //是否显示时/天切换控件

    onClickChangeEnd: function() { //点击后回调

        //获取点击的时间

        var hour = timeplay.curr_day.hour, //小时

            day = timeplay.curr_day.day, //日

            mon = timeplay.curr_day.mon, //月

            year = timeplay.curr_day.year; //年

        console.log(year + "年" + mon + "月" + day + "日" + hour + "时");

    },

    onAnimateEnd: function() { //时间轴动画每次结束回调

        var hour = timeplay.curr_day.hour, //小时

            day = timeplay.curr_day.day, //日

            mon = timeplay.curr_day.mon, //月

            year = timeplay.curr_day.year; //年

        console.log(year + "年" + mon + "月" + day + "日" + hour + "时");

    }

});

4.因为渲染不是瞬间完成，有时候时间到还没完成渲染，这时候就需要延迟一下动画

	

timeplay.delayAnimation();

待渲染完成后再继续动画

timeplay.continueAnimation();