js通過Date對象實現(xiàn)倒計時動畫效果
更新時間：2017年10月27日 10:34:25 作者：Qiy
這篇文章主要為大家詳細(xì)介紹了js通過Date對象實現(xiàn)倒計時動畫效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下
js通過Date對象實現(xiàn)倒計時效果，具體內(nèi)容如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>倒計時動畫</title>
<style>
div{
text-align:center;
height:100px;
line-height:100px;
}
</style>
<script>
window.onload = function(){
setInterval(FreeTime,1000);
}
function FreeTime(){
var curTime = Date.now();
var endTime = new Date("2017-10-26 16:00:00");
var allFreeSeconds = (endTime-curTime)/1000;
if(allFreeSeconds>0){
var freeDay = Math.floor(allFreeSeconds/(24*60*60));
var freeHour = Math.floor(allFreeSeconds/(60*60) % 24);
var freeMinute = Math.floor(allFreeSeconds/60 % 60);
var freeSecond = Math.floor(allFreeSeconds%60);
document.getElementById("nowTime").innerHTML = "剩余"+freeDay+"天"+freeHour+"時"+freeMinute+"分"+freeSecond+"秒";
}
else{
document.getElementById("nowTime").innerHTML = "已結(jié)束";
}
}
</script>
</head>
<body>
<div>
<span id="nowTime"></span>
</div>
</body>
</html>
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
js?通過Object.defineProperty()?定義和控制對象屬性
這篇文章主要介紹了js?通過Object.defineProperty()?定義和控制對象屬性，文章圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價值，需要的朋友可以參考一下2022-08-08
這篇文章主要介紹了JavaScript變量作用域及內(nèi)存問題,結(jié)合實例形式分析了javascript全局變量、局部變量、塊級作用域等概念及內(nèi)存優(yōu)化問題相關(guān)操作技巧,需要的朋友可以參考下2019-06-06
js中數(shù)組解構(gòu)與對象解構(gòu)示例代碼
數(shù)組解構(gòu)是一種在 JavaScript 中從數(shù)組中提取值并將它們分配給變量的方式,在數(shù)組解構(gòu)中分為完全解構(gòu),不完全解構(gòu),解構(gòu)失敗以及解構(gòu)默認(rèn)值,這篇文章主要介紹了js中數(shù)組解構(gòu)與對象解構(gòu),需要的朋友可以參考下2023-09-09
靜態(tài)頁面下用javascript操作ACCESS數(shù)據(jù)庫(讀增改刪)的代碼
[紅色]靜態(tài)頁面下用javascript操作ACCESS數(shù)據(jù)庫(讀增改刪)的代碼...2007-05-05
這篇文章主要為大家詳細(xì)介紹了js實現(xiàn)3D輪播圖效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
最全面的百度地圖JavaScript離線版開發(fā),這篇文章主要為大家詳細(xì)介紹了JavaScript離線版開發(fā)的相關(guān)資料,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-09-09
這篇文章主要介紹了JS使用cookie保存用戶登錄信息操作,結(jié)合具體實例形式分析了javascript使用cookie實現(xiàn)針對用戶信息的存儲與讀取相關(guān)操作技巧,需要的朋友可以參考下2019-05-05
javascript使用正則表達(dá)式實現(xiàn)注冊登入校驗
這篇文章主要為大家詳細(xì)介紹了javascript使用正則表達(dá)式實現(xiàn)注冊登入校驗，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-09-09
讓div運動起來，這篇文章主要介紹了js實現(xiàn)緩動效果的相關(guān)代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-07-07
匹配html標(biāo)記的正則...2006-07-07