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-07
JS如何判斷是否為ie瀏覽器的方法(包括IE10、IE11在內(nèi))
這篇文章主要介紹了JS如何判斷是否為ie瀏覽器的方法(包括IE10、IE11在內(nèi)),需要的朋友可以參考下2015-12-12
JavaScript實(shí)現(xiàn)星級(jí)評(píng)分
本文主要分享了JavaScript實(shí)現(xiàn)星級(jí)評(píng)分的實(shí)例代碼,具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-01-01
event.X和event.clientX的區(qū)別分析
解釋一下event.X和event.clientX有什么區(qū)別?event.clientX返回事件發(fā)生時(shí),mouse相對(duì)于客戶窗口的X坐標(biāo) event.X也一樣但是如果設(shè)置事件對(duì)象的定位屬性值為relative2011-10-10
JS實(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-08
Bootstrap打造一個(gè)左側(cè)折疊菜單的系統(tǒng)模板(二)
這篇文章主要介紹了Bootstrap打造一個(gè)左側(cè)折疊菜單的系統(tǒng)模板(二)的相關(guān)資料,需要的朋友可以參考下2016-05-05
js實(shí)現(xiàn)帶三角符的手風(fēng)琴效果
本文主要介紹了js實(shí)現(xiàn)帶三角符手風(fēng)琴效果的實(shí)例。具有很好的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-03-03

