js网页实时倒计时精确到秒级
2023-06-13 09:15:17 时间
一个很好用的js倒计时!网页实时倒计时,精确到秒级,和天数倒计时原理一样。js倒计时一般用于商城网站团购,特卖,很多地方都可用到!希望能够给大家带来帮助!
效果如下:
复制代码代码如下:
效果如下:
<!DOCTYPEhtml>
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<styletype="text/css">
.leave_time_font{margin-left:35%;}
#fo{margin-left:32%;}
</style>
<title>WoYaoNi.CN-倒计时</title>
</head>
<body>
<h1>WoYaoNi.CN</h1>
<scriptsrc="./jquery.js"></script>
<scripttype="text/javascript">
$(document).ready(function(e){
var_countSeconds=0;
function_countDown(){
_countSeconds++;
$("input.surplustime").each(function(index,element){
var$this=$(this);
var_totalTime=Number($this.val())-_countSeconds;
var_day=parseInt(_totalTime/86400);
var_hours=parseInt(_totalTime%86400/3600);
var_minutes=parseInt(_totalTime%86400%3600/60);
var_seconds=parseInt(_totalTime%86400%3600%60);
var_strLite="<spanclass="day">"+_day+"</span>天<spanclass="hour">"+_hours+"</span>小时<spanclass="minutes">"+_minutes+"</span>分<spanclass="seconds">"+_seconds+"</span>秒";
var_str="倒计时:"+_strLite;
if($this.next("p.daojishi").length>0){
$this.next("p.daojishi").html(_str);
}elseif($this.next("p.leave_time_font").length>0){
$this.next("p.leave_time_font").html(_strLite);
}
});
}
setInterval(_countDown,1000);
})
</script>
</head>
<body>
<?php
ini_set("date.timezone","Asia/Shanghai");
$currenttime=time();
$a=strtotime("2014-2-1400:00");
$b=$a-$currenttime;
?>
<divid="djs">
<divid="fo">小伙伴们距离情人节只剩:</div>
<inputtype="hidden"name="surplustime"class="surplustime"value="<?phpecho$b;?>"/>
<pclass="leave_time_font"><spanclass="day">0</span>天<spanclass="hour">0</span>小时<spanclass="minutes">0</span>分<spanclass="seconds">0</span>秒</p>
</div>
</body>
</html>
相关文章
- Js:indexOf() 和 lastIndexOf() 的区别[通俗易懂]
- JS跳转代码_js中跳转页面路径
- 【说站】js中Promise的状态探究
- 【说站】js构造继承的缺点
- Js排序算法_js 排序算法
- 牛客网js题库正解(41-60)
- JS 修改网页大法 - 一段代码,编辑整个网页~
- 如何写一个 JS 运行时
- js柯里化-面试手写版
- js分类刷leetcode.动态规划
- js 数组去除重复数据-5 个提升你 JS 编码水平的实例
- 如何将高德地图JS API嵌入到HTML网页内
- 如何使用jscythe并通过Node.js的Inspector机制执行任意JS代码
- Python3.x:Selenium+PhantomJS爬取带Ajax、Js的网页详解编程语言
- 数据JS技术实现实时获取Oracle数据(js实时获取oracle)
- JS在Oracle中的应用(js如何oracle)
- JS将文件传输至MySQL数据库(.js传文件至mysql)
- 才发现的超链接js导致网页中GIF动画停止的解决方法
- 纯js实现的论坛常用的运行代码的效果
- 屏蔽F1~F12的快捷键的js函数
- js网页侧边随页面滚动广告效果实现
- js获取网页高度(详细整理)
- 一个背景云变换js特效鼠标移动背景云变化
- js网页版计算器的简单实现
- 时间戳转换为时间年月日时间的JS函数
- js获取url参数代码实例分享(JS操作URL)
- ie浏览器使用js导出网页到excel并打印
- 一个JS函数搞定网页标题(title)闪动效果
- js获取网页可见区域、正文以及屏幕分辨率的高度
- Node.js实现的简易网页抓取功能示例