欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JS實(shí)現(xiàn)可調(diào)整倒計(jì)時(shí)間代碼分享

 更新時(shí)間：2015年08月18日 16:58:55   投稿：lijiao  
這篇文章主要介紹了JS實(shí)現(xiàn)可調(diào)整倒計(jì)時(shí)間代碼，效果很酷炫，也很具有實(shí)用價(jià)值，感興趣的小伙伴們可以參考一下

這是一款基于javascript實(shí)現(xiàn)可調(diào)整倒計(jì)時(shí)間的代碼，我們可以手動(dòng)調(diào)整倒計(jì)時(shí)間，可以精確到“天、時(shí)、分、秒”，而且樣式布局也很新穎。

先上運(yùn)行效果圖：

效果演示     源碼下載

為大家分享的可調(diào)整倒計(jì)時(shí)間的JS代碼如下（瀏覽器中如果不能正常運(yùn)行，可以嘗試切換瀏覽模式）。

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>可調(diào)整倒計(jì)時(shí)間的JS代碼</title>
<!--[if lte IE 6]>
<script src="js/DD_belatedPNG_0.0.8a.js" type="text/javascript"></script>
 <script type="text/javascript">
 DD_belatedPNG.fix('a');
 </script>
<![endif]-->
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<script type="text/javascript">
window.onload=function ()
{
 var oFill=document.getElementById('fill_in');
 var oInputYear=oFill.getElementsByTagName('input')[0];
 var oInputMonth=oFill.getElementsByTagName('input')[1];
 var oInputDay=oFill.getElementsByTagName('input')[2];
 
 var oBtn=document.getElementById('go');
 var oBtn2=document.getElementById('go2');
 
 var oTxtDay=document.getElementById('day');
 var oTxtHour=document.getElementById('hour');
 var oTxtMin=document.getElementById('min');
 var oTxtSec=document.getElementById('sec');
 var oTxtTarget=document.getElementById('target').getElementsByTagName('strong')[0];
 
 var timer=null;
 
 oBtn2.onclick=function ()
 {
 timer=setInterval(updateTime, 1000);
 updateTime();
 oTxtTarget.innerHTML=oInputYear.value+"年"+oInputMonth.value+"月"+oInputDay.value+"日";
 };
 
 function fillZero(num, digit)
 {
 var str=''+num;
 
 while(str.length<digit)
 {
 str='0'+str;
 }
 
 return str;
 }
 
 function updateTime()
 {
 var oDateEnd=new Date();
 var oDateNow=new Date();
 
 var iRemain=0;
 
 var iDay=0;
 var iHour=0;
 var iMin=0;
 var iSec=0;
 
 oDateEnd.setFullYear(parseInt(oInputYear.value));
 oDateEnd.setMonth(parseInt(oInputMonth.value)-1);
 oDateEnd.setDate(parseInt(oInputDay.value));
 oDateEnd.setHours(0);
 oDateEnd.setMinutes(0);
 oDateEnd.setSeconds(0);
 
 iRemain=(oDateEnd.getTime()-oDateNow.getTime())/1000;
 
 if(iRemain<=0)
 {
 clearInterval(timer);
 iRemain=0;
 alert('已過(guò)時(shí)間');
 }
 
 iDay=parseInt(iRemain/86400);
 iRemain%=86400;
 
 iHour=parseInt(iRemain/3600);
 iRemain%=3600;
 
 iMin=parseInt(iRemain/60);
 iRemain%=60;
 
 iSec=iRemain;
 
 oTxtDay.innerHTML=fillZero(iDay,3);
 oTxtHour.innerHTML=fillZero(iHour,2);
 oTxtMin.innerHTML=fillZero(iMin,2);
 oTxtSec.innerHTML=fillZero(iSec,2);
 }
 
 var t=null;
 var alpha=0;
 var bShow=true;
 setInterval(function (){
 if(bShow)
 {
 startMove(100);
 }
 else
 {
 startMove(0);
 }
 
 bShow=!bShow;
 
 function startMove(iTarget)
 {
 if(t)clearInterval(t);
 t=setInterval(function (){
 doMove(iTarget);
 }, 30);
 }
 
 function doMove(iTarget)
 {
 var iSpeed=0;
 if(alpha<iTarget)
 {
 iSpeed=2;
 }
 else
 {
 iSpeed=-2;
 }
 
 if(alpha==iTarget)
 {
 clearInterval(t);
 t=null;
 
 if(iTarget==100)
 {
 startMove(0);
 }
 }
 else
 {
 alpha+=iSpeed;
 
 oBtn2.style.filter="alpha(opacity:"+alpha+")";
 oBtn2.style.opacity=alpha/100;
 }
 }
 }, 2000);
};
</script>
<body>

<div id="miaov">
 <div id="fill_in">
 <span class="title">請(qǐng)輸入：</span>
 <input type="text" class="long_text" value="2015" />
 <span class="space1">年</span>
 <input type="text" class="text" value="10" />
 <span class="space2">月</span>
 <input type="text" class="text" value="1" />
 <span class="space3">日</span>
 </div>

 <a href="javascript:;" id="go" class="go"></a>
 <a href="javascript:;" id="go2" class="active"></a>

 <p id="target">
 現(xiàn)在距離 -
 <strong>2015年10月1日</strong>
 - 還剩：
 </p>

 <div id="date">
 <p id="day">000</p>
 <p id="hour">00</p>
 <p id="min">00</p>
 <p id="sec">00</p>
 </div>
 </div>
 
</body>
</html>

以上就是為大家分享的JS實(shí)現(xiàn)可調(diào)整倒計(jì)時(shí)間代碼，是不是很贊，希望大家可以喜歡。

相關(guān)文章

  • JS實(shí)現(xiàn)圖片拖拽交換效果

    JS實(shí)現(xiàn)圖片拖拽交換效果

    這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)圖片拖拽交換效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2018-11-11
  • EditPlus中的正則表達(dá)式 實(shí)戰(zhàn)(2)

    EditPlus中的正則表達(dá)式 實(shí)戰(zhàn)(2)

    這篇文章主要介紹了EditPlus中的正則表達(dá)式 實(shí)戰(zhàn)(2)的相關(guān)資料,需要的朋友可以參考下
    2016-12-12
  • js版實(shí)現(xiàn)計(jì)算器功能

    js版實(shí)現(xiàn)計(jì)算器功能

    這篇文章主要為大家詳細(xì)介紹了js版實(shí)現(xiàn)計(jì)算器功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2021-09-09
  • JavaScript實(shí)現(xiàn)select添加option

    JavaScript實(shí)現(xiàn)select添加option

    這篇文章主要介紹了JavaScript為select添加option的方法和示例，十分的簡(jiǎn)單實(shí)用，有需要的小伙伴可以參考下。
    2015-07-07
  • 屏蔽Flash右鍵信息的js代碼

    屏蔽Flash右鍵信息的js代碼

    網(wǎng)上好多屏蔽flash右鍵的方法，可多數(shù)是過(guò)期的或不合適的，現(xiàn)記錄下用JS方法屏蔽flash右鍵相關(guān)版權(quán)信息。
    2010-01-01
  • Javascript 實(shí)現(xiàn)匿名遞歸的實(shí)例代碼

    Javascript 實(shí)現(xiàn)匿名遞歸的實(shí)例代碼

    本篇文章主要介紹了Javascript 實(shí)現(xiàn)匿名遞歸的實(shí)例代碼，利用 arguments.callee 來(lái)實(shí)現(xiàn)匿名遞歸的方式。有興趣的可以了解一下
    2017-05-05
  • js前端實(shí)現(xiàn)登錄拼圖驗(yàn)證功能

    js前端實(shí)現(xiàn)登錄拼圖驗(yàn)證功能

    行為驗(yàn)證碼通過(guò)用戶的操作來(lái)完成驗(yàn)證,常見(jiàn)的行為驗(yàn)證碼有拖動(dòng)式和點(diǎn)觸式,下面這篇文章主要給大家介紹了關(guān)于js前端實(shí)現(xiàn)登錄拼圖驗(yàn)證功能的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
    2023-02-02
  • JavaScript中判斷的優(yōu)雅寫(xiě)法示例

    JavaScript中判斷的優(yōu)雅寫(xiě)法示例

    判斷語(yǔ)句這個(gè)我們不陌生,就是判斷是否滿足指定的條件,如果滿足則執(zhí)行一定的代碼,否則跳過(guò),下面這篇文章主要給大家介紹了關(guān)于JavaScript中判斷的優(yōu)雅寫(xiě)法,需要的朋友可以參考下
    2021-10-10
  • 詳解JS ES6變量的解構(gòu)賦值

    詳解JS ES6變量的解構(gòu)賦值

    這篇文章主要介紹了JS ES6變量的解構(gòu)賦值，對(duì)ES6感興趣的同學(xué)，可以參考下
    2021-05-05
  • 在小程序中使用騰訊視頻插件播放教程視頻的方法

    在小程序中使用騰訊視頻插件播放教程視頻的方法

    這篇文章主要介紹了在小程序中使用騰訊視頻插件播放教程視頻的方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2018-07-07

最新評(píng)論