JS實(shí)現(xiàn)秒殺倒計(jì)時(shí)特效
本文實(shí)例為大家分享了JS實(shí)現(xiàn)秒殺倒計(jì)時(shí)特效的具體代碼,供大家參考,具體內(nèi)容如下
知識(shí)點(diǎn)
添加一個(gè)定時(shí)器,對(duì)時(shí)間標(biāo)簽不斷進(jìn)行更新設(shè)置即可。
引入工具庫(kù)工具庫(kù)
運(yùn)行效果
代碼
引入MyTool.js
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> div{ font-size: 30px; } span{ background-color: #000; color: #fff; border-radius: 10px; padding: 0 5px; } </style> </head> <body> <div id="box"> <span>00</span>:<span>00</span>:<span>00</span> </div> <script src="../00MyTools/MyTools.js"></script> <script> window.addEventListener('load',function (ev) { var hour = myTool.$('box').children[0], min = myTool.$('box').children[1], sec = myTool.$('box').children[2]; var time = 8 * 60 * 60; var timer = setInterval(function () { time--; hour.innerText = myTool.addZero(myTool.secondToHourMinSecond(time).hour); min.innerText = myTool.addZero(myTool.secondToHourMinSecond(time).min); sec.innerText = myTool.addZero(myTool.secondToHourMinSecond(time).second); if (time===0){ clearInterval(timer); } },1000); },false); </script> </body> </html>
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- JavaScript仿京東秒殺倒計(jì)時(shí)
- js實(shí)現(xiàn)京東秒殺倒計(jì)時(shí)功能
- JS腳本實(shí)現(xiàn)網(wǎng)頁(yè)自動(dòng)秒殺點(diǎn)擊
- Javascript實(shí)現(xiàn)商品秒殺倒計(jì)時(shí)(時(shí)間與服務(wù)器時(shí)間同步)
- 如何利用 JS 腳本實(shí)現(xiàn)網(wǎng)頁(yè)全自動(dòng)秒殺搶購(gòu)功能
- PHP+JS實(shí)現(xiàn)的商品秒殺倒計(jì)時(shí)用法示例
- JS實(shí)現(xiàn)商城秒殺倒計(jì)時(shí)功能(動(dòng)態(tài)設(shè)置秒殺時(shí)間)
- JavaScript實(shí)現(xiàn)京東秒殺效果
相關(guān)文章
javascript小組件 原生table排序表格腳本(兼容ie firefox opera chrome)
javascript小組件 原生table排序表格腳本 兼容ie firefox opera chrome,需要的朋友可以參考下2012-07-07JS如何判斷是否為ie瀏覽器的方法(包括IE10、IE11在內(nèi))
這篇文章主要介紹了JS如何判斷是否為ie瀏覽器的方法(包括IE10、IE11在內(nèi)),需要的朋友可以參考下2015-12-12JavaScript實(shí)現(xiàn)星級(jí)評(píng)分
本文主要分享了JavaScript實(shí)現(xiàn)星級(jí)評(píng)分的實(shí)例代碼,具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-01-01event.X和event.clientX的區(qū)別分析
解釋一下event.X和event.clientX有什么區(qū)別?event.clientX返回事件發(fā)生時(shí),mouse相對(duì)于客戶窗口的X坐標(biāo) event.X也一樣但是如果設(shè)置事件對(duì)象的定位屬性值為relative2011-10-10JS實(shí)現(xiàn)的DOM插入節(jié)點(diǎn)操作示例
這篇文章主要介紹了JS實(shí)現(xiàn)的DOM插入節(jié)點(diǎn)操作,結(jié)合實(shí)例形式分析了javascript針對(duì)頁(yè)面dom元素動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-04-04使用JavaScript實(shí)現(xiàn)node.js中的path.join方法
Node.JS中的 path.join 非常方便,能直接按相對(duì)或絕對(duì)合并路徑,有時(shí)侯前端也需要這種方法,如何實(shí)現(xiàn)呢?感興趣的朋友跟隨腳本之家小編一起看看吧2018-08-08Bootstrap打造一個(gè)左側(cè)折疊菜單的系統(tǒng)模板(二)
這篇文章主要介紹了Bootstrap打造一個(gè)左側(cè)折疊菜單的系統(tǒng)模板(二)的相關(guān)資料,需要的朋友可以參考下2016-05-05js實(shí)現(xiàn)帶三角符的手風(fēng)琴效果
本文主要介紹了js實(shí)現(xiàn)帶三角符手風(fēng)琴效果的實(shí)例。具有很好的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-03-03