标签：
demo:
<!DOCTYPE HTML>
<html lang="zh">
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<meta name="applicable-device" content="pc,mobile" />
<title>买房玩吧</title>
<meta name="renderer" content="webkit" />
<meta name="keywords" content="房产资讯,房价走势,地产名博,企业动态,房产投资"/>
<meta name="description" content="凤凰房产北京为您提供最新的房产资讯。"/>
<script src="http://s0.ifengimg.com/static/js/jquery-1.7.2.min_c4de8813.js"></script>
<style>
style
</style>
</head>
<body>
<p class="countdown" time="14566752000">倒计时：
<span class="day">0</span>天
<span class="hour">00</span>小时
<span class="min">00</span>分
<span class="sec">00</span>秒
</p>
<script type="text/javascript" src="countDown_clear.js"></script>
</body>
</html>
JS:
/*******************倒计时********************/
function countDown(selecter) {
this.selecter = selecter;
this.container = $(selecter);
this.timer = [null, null, null, null];
}
countDown.prototype = {
init: function() {
var me = this;
me.container = $(document).find(me.selecter);
for (var i = 0; i < me.container.length; i++) {
clearInterval(me.timer[i]);
}
for (var i = 0; i < me.container.length; i++) {
var obj = $(me.selecter + ":eq(" + i + ")");
var endTime = obj.attr("time");
this.countdown(obj, endTime, i);//先执行一次，显示倒计时结束的状态；
var oDate = new Date();
var s = endTime - parseInt(oDate.getTime() / 1000);
if (s < 0) continue;
(function(obj, endTime, i){
me.timer[i] = setInterval(function() {
me.countdown(obj, endTime, i);
}, 1000);
})(obj, endTime, i);
}
},
countdown: function(obj, endTime, index) {
var oDate = new Date();
var s = endTime - parseInt(oDate.getTime() / 1000);
if (s < 0) { //活动结束后
data = {
day: 0,
hour: 00,
min: 00,
sec: 00
};
for (var i in data) {
obj.find("." + i).html(data[i]);
}
obj.html("活动进行中!");
} else {
var data = {};
data.day = parseInt(s / 86400);
s %= 86400;
data.hour = parseInt(s / 3600);
s %= 3600;
data.min = parseInt(s / 60);
data.sec = s % 60;
for (var i in data) {
obj.find("." + i).html(data[i]);
}
}
}
};
$(document).ready(function() {
var clock = new countDown(".countdown");
clock.init();
});
JS-滚到可视区才开始 倒计时：
/*******************倒计时********************/
function countDown(selecter) {
this.selecter = selecter;
this.container = $(selecter);
this.timer = [null, null, null, null];
this.onlyOne = false;
this.cover = [false, false, false, false];
}
countDown.prototype = {
init: function() {
var me = this;
me.container = $(document).find(this.selecter);
for (var i = 0; i < me.container.length; i++) {
clearInterval(me.timer[i]);
}
//if (me.onDoing()) {
if (me.onlyOne) {
return;
};
me.onlyOne = true;
for (var i = 0; i < me.container.length; i++) {
me.doingCount();//先执行一次，免得出现一秒的0；
me.timer[i] = setInterval(function() {
me.doingCount();
}, 1000);
}
// }
// this.bind()
},
bind: function() {
var me = this;
$(window).on(‘scroll‘, function() {
if (me.onDoing()) {
if (me.onlyOne) {
return;
};
me.onlyOne = true;
for (var i = 0; i < me.container.length; i++) {
me.timer[i] = setInterval(function() {
me.doingCount();
}, 1000);
}
} else {
for (var i = 0; i < me.container.length; i++) {
clearInterval(me.timer[i]);
}
me.onlyOne = false;
}
});
},
onDoing: function() {
var st = $("html").scrollTop() || $("body").scrollTop();
var cH = $(window).height();
var cst = $(".doing-countdown").offset().top;
var conH = $(".doing-countdown").height();
return st > cst - cH && st < cst + conH;
},
doingCount: function() {
this.container = $(document).find(this.selecter);
for (var i = 0; i < this.container.length; i++) {
var obj = $(this.selecter + ":eq(" + i + ")");
var endTime = obj.attr("time");
this.countdown(obj, endTime, i);
}
},
countdown: function(obj, endTime, index) {
var oDate = new Date();
var s = endTime - parseInt(oDate.getTime() / 1000);
if (s < 0) { //活动结束后
data = {
day: 0,
hour: 00,
min: 00,
sec: 00
};
for (var i in data) {
obj.find("." + i).html(data[i]);
}
if (this.cover[index]) {
return;
}
this.cover[index] = true;
obj.html("活动进行中!");
} else {
var data = {};
data.day = parseInt(s / 86400);
s %= 86400;
data.hour = parseInt(s / 3600);
s %= 3600;
data.min = parseInt(s / 60);
data.sec = s % 60;
for (var i in data) {
obj.find("." + i).html(data[i]);
}
}
}
};
$(document).ready(function() {
var clock = new countDown(".countdown");
clock.init();
});
标签：
原文地址：http://www.cnblogs.com/mbyund/p/5484990.html
