您的当前位置:首页 >娄底市 >给网站添加一个活动倒计时效果 线报活动结束提示效果 正文
时间:2024-12-25 16:43:50 来源:网络整理编辑:娄底市
大家好,我是小编鹏仔哥,本Q站主要是以资源活动分享为主体的网站,所以经常会分享一些活动,是活动都有结束时间,刚好前段时间逛其他网站,看到对应活动有对应结束倒计时效果,活动结束后会提示活动已经结束,给用
大家好,我是小编鹏仔哥,本Q站主要是以资源活动分享为主体的网站,所以经常会分享一些活动,是活动都有结束时间,刚好前段时间逛其他网站,看到对应活动有对应结束倒计时效果,活动结束后会提示活动已经结束,给用户体验是比较好的,所以也写了这个效果,分享给大家。
看广告赚钱的软件因为考虑到大家一些网站没有使用jq,或者jq版本低之类,所以使用原生来实现效果,这样任何网站都是可以使用。
作者:鹏仔先生
效果如下图所示:
如果活动没结束,那么显示距离结束时间,为绿色,如果到期了,那么显示 活动已经结束,为红色提示。
下方是对应html和js代码
将html代码span标签中的时间修改为到期时间,格式看广告赚钱的软件一定要正确,例如 2018-08-08 24:00:00 ,并放置需要显示的地方。
将js代码,放置公共js中,或者其他只要引入的js文件中即可。
Markup
<spanid="ActivityDate">2020-05-08 24:00:00span>
JavaScript
<script>// 获取idvar ActivityDate = document.getElementById("ActivityDate"); functiontimepiece(key){ var datatime = /^[\d]{4}-[\d]{1,2}-[\d]{1,2}( [\d]{1,2}:[\d]{1,2}(:[\d]{1,2})?)?$/ig,str=,s; // 正则验证日期格式是否正确if(!key.match(datatime)){ console.log(日期参数错误,请按格式填写,如 1996-10-22 24:00:00); return } // 当前日期减去活动日期,判断是否超出var sec = (newDate(key.replace(/-/ig,/)).getTime() - newDate().getTime())/1000; if(sec < 0){ ActivityDate.innerHTML = " + ">" + "本活动已经结束" + ""; return } s = { 天:sec/24/3600, 时:sec/3600%24, 分:sec/60%60, 秒:sec%60 } for(i in s){ if(Math.floor(s[i]) >0) str += Math.floor(s[i]) + i; } if(Math.floor(sec) == 0){ str=0秒; } // 距离活动结束时间显示到页面 ActivityDate.innerHTML = " + ">" + "本活动还有" + str + "结束" + ""; // 每隔1秒更新一次 setTimeout(function(){ timepiece(key) },1000) } timepiece(ActivityDate.innerHTML); script>
对于样式,没做什么美化,后期有看广告赚钱的软件空会更新美化版。
00后男大学生:背娃登顶泰山,一次只要500元,一天能接一两单!宝宝辅食调味料合集来喽让饭渣秒变饭霸2024-12-25 16:34
【科股宝战绩回顾】风电传媒涨幅靠前,《精华研报》上周一解读广告营销至今板块涨近20%医生建议:多吃5种水果,维生素C含量高,助力增强免疫2024-12-25 16:21
四人小学文化诈骗上亿元,每天睡醒进账千万,男子:收钱收到害怕演员句号:二婚娶丫蛋为妻,尽心孝顺岳父母,活成了孝子贤夫2024-12-25 16:21
美图靠卖加密货币赚了6个亿?美图的系列操作该咋看?温情讲述错位的救赎与和解,《异乡来客》定档12月20日温暖上映2024-12-25 15:33
广西一女大学生:校门口卖糖葫芦,遭多名男子威胁,更多细节曝光当婆婆说不给你们带孩子了,有本事让你自己妈妈带的时候,怎么办2024-12-25 15:24
老人沉迷刷App挣钱 治本之策是充盈内心1989年台湾老妇回山东探亲,妹妹接机时下跪大哭我把你闺女弄丢了2024-12-25 15:21
广西一女大学生:校门口卖糖葫芦,遭多名男子威胁,更多细节曝光成年女人的顶级清醒:任何一段关系,失我者永失2024-12-25 15:15
怎么赚钱,尽量去做一个人就能干的小生意晚清颜值派超级女星杨翠喜,到底有多美,身价万金皇家子孙都垂涎2024-12-25 15:06
一套采集软件2998元,教学博主们靠搬运视频在京东闷声赚钱为找失散31年的女儿,64岁父亲跑遍全国,凭脸上特征一眼认出女儿2024-12-25 15:02
刷视频还能赚钱?假!儋州警方捣毁一电信网络诈骗窝点2005年见义勇为英雄韦兆安,因无钱治疗,从医院19楼一跃而下2024-12-25 14:04
起底电诈丨@大学生 学历高≠不被骗!假期想找兼职、看演唱会的同学看过来儿子去北京打工13年,年迈父母带特殊礼物寻找,得知原因全场泪崩2024-12-25 16:40
港股下半年IPO热潮或持续《九重紫》竟有蒋欣前男友,出场两分钟秒杀男主,年纪越大越帅2024-12-25 16:38
津派文化 河东表达│探寻李大钊、张太雷在大直沽的革命足迹 2024-12-25 16:32
从亏到亿:免费地图软件如何实现盈利增长做人该翻脸时就翻脸,对于这三种人不要客气2024-12-25 16:14
2024年河北品牌万里行线上对接活动正式启动 2024-12-25 15:43
苏醒张远去看欧洲杯球赛,快发制作人赵琳琳同行,快发3要来了?美丽流泪了,是什么让她伤心难过?原因只有她自己知道2024-12-25 15:00
国内短视频平台排行榜(十大收益最好的自媒体平台) 2024-12-25 14:56
DNF手游:别再浪费疲劳升级了,一把深渊赚225万泰拉男人开始变老,会有这几大信号2024-12-25 14:52
峦涧凌续搏芹局2024-12-25 14:48
中国最狠赚钱王:爆火20年,全靠最硬“后台”!战争片《大突围》第一波真实口碑出炉!观众的评价一针见血2024-12-25 14:36