You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 lines
3.9 KiB
105 lines
3.9 KiB
/*
|
|
* 倒计时 小插件
|
|
* @since 2018/11/7 12:39
|
|
* @author FlyTiger
|
|
* */
|
|
(function (global, factory) {
|
|
typeof exports === "object" && typeof module !== "undefined" ? module.exports = factory() : typeof define === "function" && define.amd ? (function(){ define(["jquery"],factory);global.countDown = factory();})() : (global.countDown = factory());
|
|
})(this, function () {
|
|
var ___=window;
|
|
//模板
|
|
var $defaultTitle=["距离","开始","还有"];
|
|
var $template="<span class=\"active-time pull-right\"><em class=\"time_d sd\"></em><span class=\"sd\">天</span><em class=\"time_h sh\"></em><span class=\"sh\">时</span><em class=\"time_m sm\"></em><span class=\"sm\">分</span><em class=\"time_s\"></em>秒";
|
|
|
|
//事件
|
|
var events={
|
|
started:"countDownStarted",//开启
|
|
ended:"countDownEnded",//结束
|
|
restarted:"countDownRestarted"//重启
|
|
};
|
|
|
|
//方法
|
|
var fns={
|
|
//标题处理
|
|
_title:function(){
|
|
var _opts=this.opts;
|
|
var $prefix=this.$timeEms_.$prefix,$suffix=this.$timeEms_.$suffix;
|
|
if((_opts.title&&_opts.title.length)||(!_opts.prefix&&!_opts.suffix)){
|
|
var _1= [].concat($defaultTitle);
|
|
_1.splice(1,1,_opts.title||$defaultTitle[1]);
|
|
$prefix.html(_1.join(""));
|
|
}else{
|
|
$prefix.html(_opts.prefix||"");
|
|
$suffix.html(_opts.suffix||"");
|
|
}
|
|
},
|
|
//初始化
|
|
prepare:function(){
|
|
fns._title.call(this);
|
|
fns._f.call(this);
|
|
},
|
|
_f:function () {
|
|
var _this=this;
|
|
var time_end=this.opts.time_end||new Date().getTime();
|
|
var _ems=this.$timeEms_;
|
|
var f_=function _f(_time_end){
|
|
var time_start = new Date().getTime(); //设定当前时间
|
|
var time_end = new Date(_time_end).getTime(); //设定目标时间
|
|
// 计算时间差
|
|
var time_distance = time_start - time_end;
|
|
|
|
|
|
if(time_distance<1){
|
|
if(_this._timestamp_){
|
|
clearTimeout(_this._timestamp_);
|
|
}
|
|
_this._runing++;
|
|
_this.$container_.hide().triggerHandler(events.ended,[_this._runing,time_start]);
|
|
return false;
|
|
}
|
|
// 天
|
|
var int_day = Math.floor(time_distance/86400000)
|
|
time_distance -= int_day * 86400000;
|
|
// 时
|
|
var int_hour = Math.floor(time_distance/3600000)
|
|
time_distance -= int_hour * 3600000;
|
|
// 分
|
|
var int_minute = Math.floor(time_distance/60000)
|
|
time_distance -= int_minute * 60000;
|
|
// 秒
|
|
var int_second = Math.floor(time_distance/1000)
|
|
|
|
// 显示时间
|
|
_ems.$d.html(int_day);
|
|
_ems.$h.html(int_hour);
|
|
_ems.$m.html(int_minute);
|
|
_ems.$s.html(int_second);
|
|
// 设置定时器
|
|
if(_this._timestamp_){
|
|
clearTimeout(_this._timestamp_);
|
|
}
|
|
_this._timestamp_=setTimeout(function (_) {
|
|
_f(_);
|
|
},1000,_time_end);
|
|
};
|
|
if(this._runing){
|
|
this.$container_.triggerHandler(events.restarted,[this._runing]);
|
|
}else{
|
|
this.$container_.triggerHandler(events.started,[this._runing]);
|
|
}
|
|
this.$container_.show();
|
|
f_(time_end);
|
|
}
|
|
};
|
|
|
|
|
|
return function($container,$opts){
|
|
if(!___.jQuery){
|
|
throw new Error("jQuery is required for this plugin");
|
|
}
|
|
if(!$container||!$container.length){
|
|
throw new Error("The container you given is not useful!");
|
|
}
|
|
return new CountDown($container,$opts);
|
|
}
|
|
});
|