html时间轴横向自动播放,利用jQuery实现日期时间轴自动播放代码

特效描述:利用jQuery实现 日期时间轴 自动播放代码。利用jQuery实现日期时间轴自动播放代码

代码结构

1. 引入CSS

2. 引入JS

3. HTML代码

渲染未完成延迟动画

渲染完成继续动画

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 + "时");

}

});

$("#pause").click(function(){

timeplay.delayAnimation();//延迟动画

})

$("#play").click(function(){

timeplay.continueAnimation();//继续动画

})

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值