玩转网页倒计时

最新推荐文章于 2022-03-27 23:00:46 发布

天时992

最新推荐文章于 2022-03-27 23:00:46 发布

阅读量5.7k

点赞数 20

分类专栏： JavaScript 文章标签： javascript css

本文链接：https://blog.csdn.net/asd18293347341/article/details/114795278

版权

接上篇模拟快递单号查询案例（放大输入内容）
购物仍然是一件Happy的事情！尤其是在双11，双12这些天，大家内心是不是有些小激动呢！是不是对这样的页面感到情有独钟呢？[上图！！！]
限时抢购
那么，你想不想知道它是怎么做到的呢？来一起get它的神秘吧！（一寸光阴一寸金时刻：学完这个知识点，可以自己制作一个小倒计时钟表网页，图标放的大大的，来感受时间的流逝吧）

在开始之前，我们先来看一下时，分，秒的计算公式吧（本人当时苦思了好久，之前觉得数学学的还不错，怎么找不到它是怎么算出来的呢，于是上网查了好久，也没找到。但突然一刹那，灵光突降，反过来看，好像很简单啊！哈哈哈，算是一个经验吧，如果正着解决不了，反着来看说不定就柳暗花明又一村了呢，因此，思维方式很重要！！！打住，步入主题）
计算时，分，秒公式

【要求】：某商品在将来某一天进行促销一天，利用js制作倒计时效果：时：分：秒！

【代码思路】

一般都是设置一个合适的促销时间，（比如我的要求：在将来某一天进行促销一天）
然后此刻开启倒计时，当满足要求（此时天数满足条件为===0，即小于等于一天）时，显示倒计时页面
当促销结束，让倒计时一直显示 00:00:00的页面，等待后续处理

效果如下：
倒计时页面

代码如下：大家一起来感受一下它的魅力吧！

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		
		<!-- css样式 -->
		<style type="text/css">
			* {
    
				margin: 0;
				padding: 0;
			}
			.onsell {
    
				height: 400px;
				width: 200px;
				border: 1px solid #F2F2F2;
				margin: 10px;
				box-shadow

最低0.47元/天解锁文章

天时992

关注

20
点赞
踩
43

收藏

觉得还不错? 一键收藏
34
评论
玩转网页倒计时

接上篇模拟快递单号查询案例（放大输入内容）购物仍然是一件Happy的事情！尤其是在双11，双12这些天，大家内心是不是有些小激动呢！是不是对这样的页面感到情有独钟呢？[上图！！！]那么，你想不想知道它是怎么做到的呢？来一起get它的神秘吧！（一寸光阴一寸金时刻：学完这个知识点，可以自己制作一个小倒计时钟表网页，图标放的大大的，来感受时间的流逝吧）在开始之前，我们先来看一下时，分，秒的计算公式吧（本人当时苦思了好久，之前觉得数学学的还不错，怎么找不到它是怎么算出来的呢，于是上网查了好久，也没找到。但突
复制链接

扫一扫