1.html Code:
<div class= "Count_app count_app2" style= "position:absolute;width:100%;height:100%;left:20%;" >
<div class= "Hotdate countmsg" style= "DISPLAY:NONE;POSITION:ABSOLUTE;BOTTOM:3PX;" >
<span> from the start of the event and:</span>
<span class= "Conunt t_d" ></span>
<span> days </span>
<span class= "Conunt t_h" ></span>
<span> Time </span>
<span class= "Conunt t_m" ></span>
<span> points </span>
<span class= "Conunt t_s" ></span>
<span> seconds </span>
</div>
</div>
<div class= "Count_app count_app2" style= "position:absolute;width:100%;height:100%;left:20%;" >
<div class= "Hotdate countmsg" style= "DISPLAY:NONE;POSITION:ABSOLUTE;BOTTOM:3PX;" >
<span> from the start of the event and:</span>
<span class= "Conunt t_d" ></span>
<span> days </span>
<span class= "Conunt t_h" ></span>
<span> Time </span>
<span class= "Conunt t_m" ></span>
<span> points </span>
<span class= "Conunt t_s" ></span>
<span> seconds </span>
</div>
</div>
2.js Code:
Resolve page Two countdown the same class name, conflict problem
function $$ (selector, context) {
return [].slice.call (context | | document). Queryselectorall (selector));
}
function Getrtime () {
$.post ('/bonus/getacivityremindertime ', function (d) {
if (typeof d = = = ' String ') d = json.parse (d);
Seconds
var nowtime = +d.msg, EndTime = Math.floor (New Date (' 2015/8/18 '). GetTime ()/1000);
var t = endtime-nowtime;
function ShowTime () {
t = t-1;
if (t <= 0) {
Clearinterval (timer);
$ ('. Countmsg '). Hide ()
}
var d = Math.floor (t/86400);//day
var h = Math.floor (t% 86400/3600);//hour
var m = Math.floor (t% 86400 3600/60);//min
var s = Math.floor (t% 86400 3660 60);//sec
$$ ('. T_d '). ForEach (function (item) {
Item.textcontent = D;
});
$$ ('. T_h '). ForEach (function (item) {
Item.textcontent = h;
});
$$ ('. T_m '). ForEach (function (item) {
Item.textcontent = m;
});
$$ ('. t_s '). ForEach (function (item) {
Item.textcontent = s;
});
}
var timer = setinterval (showTime, 1000);
var w = $$ ('. Countmsg ');
W.foreach (function (item) {
Item.style.display = "block";
});
if (t <= 0) {
W.foreach (function (item) {
Item.style.display = "None";
Item.parentNode.removeChild (item);
});
}
})
}