js實現某年某月某天距離現在有多少天,多少分,多少秒,動態顯示!
阿新 • • 發佈：2019-01-27
<script type="text/javascript" src="functions.js" charset="utf-8"></script>
具體的內容如下：var $win = $(window); var clientWidth = $win.width(); var clientHeight = $win.height(); $(window).resize(function() { var newWidth = $win.width(); var newHeight = $win.height(); if (newWidth != clientWidth && newHeight != clientHeight) { location.replace(location); } }); (function($) { $.fn.typewriter = function() { this.each(function() { var $ele = $(this), str = $ele.html(), progress = 0; $ele.html(''); var timer = setInterval(function() { var current = str.substr(progress, 1); if (current == '<') { progress = str.indexOf('>', progress) + 1; } else { progress++; } $ele.html(str.substring(0, progress) + (progress & 1 ? '_' : '')); if (progress >= str.length) { clearInterval(timer); } }, 75); }); return this; }; })(jQuery); function timeElapse(date){ var current = Date(); var seconds = (Date.parse(current) - Date.parse(date)) / 1000; var days = Math.floor(seconds / (3600 * 24)); seconds = seconds % (3600 * 24); var hours = Math.floor(seconds / 3600); if (hours < 10) { hours = "0" + hours; } seconds = seconds % 3600; var minutes = Math.floor(seconds / 60); if (minutes < 10) { minutes = "0" + minutes; } seconds = seconds % 60; if (seconds < 10) { seconds = "0" + seconds; } var result = "第 <span class=\"digit\">" + days + "</span> 天 <span class=\"digit\">" + hours + "</span> 小時 <span class=\"digit\">" + minutes + "</span> 分鐘 <span class=\"digit\">" + seconds + "</span> 秒"; $("#clock").html(result); }
3.不多說了，直接上完整程式碼，程式碼上有註釋
<body> <div id="clock-box"> <span></span><font color="#33CC00">我們</font> <span>已經是……</span> <div id="clock"></div> </div> </body> <script src=" jquery-1.11.1.min.js "></script> <script type="text/javascript" src="jscex.min.js"></script> <script type="text/javascript" src="jscex-parser.js"></script> <script type="text/javascript" src="jscex-jit.js"></script> <script type="text/javascript" src="jscex-builderbase.min.js"></script> <script type="text/javascript" src="jscex-async.min.js"></script> <script type="text/javascript" src="jscex-async-powerpack.min.js"></script> <script type="text/javascript" src="functions.js" charset="utf-8"></script> <script> var textAnimate = eval(Jscex.compile("async", function () { var together = new Date(); together.setFullYear(2014,10, 15); //時間年月日，注意月份是0-11 together.setHours(0); //小時 together.setMinutes(0); //分鐘 together.setSeconds(0); //秒前一位 together.setMilliseconds(0); //秒第二位 $("#clock-box").fadeIn(500); while (true) { timeElapse(together); $await(Jscex.Async.sleep(1000)); } })); textAnimate().start(); </script>