本文以团购网站的倒计时为例,给三件商品赋予了结束时间及2016年春节结束时间。
页面底部有演示、免费下载链接。若是想看更多js特效、网站源码、 js教程请访问 http://www.sucaihuo.com/js 还有演示demo,最主要是可以免费下载。我们为三件商品分别定义了结束时间戳,即class为“.endtime”属性value值。
美茵儿 2015韩版新款印花夏装
阿米路2015夏装新款两件套
映帘2015春装女装新款 韩版
jquery
每个商品定时100毫秒执行一次setinterval里面的代码。接着each()方法遍历计算每个商品的倒计时,单位为天、小时、分、秒。
var time_current = (new date()).valueof(); //获取当前时间
$(function() {
var datetime = new date();
var difference = datetime.gettime() - time_current;
setinterval(function() {
$(.endtime).each(function() {
var obj = $(this);
var endtime = new date(parseint(obj.attr('value')) * 1000);
var nowtime = new date();
var nms = endtime.gettime() - nowtime.gettime() + difference;
var myd = math.floor(nms / (1000 * 60 * 60 * 24));
var myh = math.floor(nms / (1000 * 60 * 60)) % 24;
var mym = math.floor(nms / (1000 * 60)) % 60;
var mys = math.floor(nms / 1000) % 60;
var myms = math.floor(nms / 100) % 10;
if (myd >= 0) {
var str = myd + 天 + myh + 小时 + mym + 分 + mys + . + myms + 秒;
} else {
var str = 已结束!;
}
obj.html(str);
});
},
100);
});查看该特效演示及免费下载,请访问http://www.sucaihuo.com/js/36.html
ad:真正免费,域名+虚机+企业邮箱=0元