明日まであと何時間！？本日の残り時間をHTMLで表示してみた(CSSで装飾もした☆)

※10/26追記：現在、ブログトップページで、この時間を確認すると、なぜか現在時刻が表示されるようです。原因不明となりますが、分かり次第修正予定です😭

本日の残り時間

00:00:00

↓の亜種。

latestech.hatenablog.com

明日まで何時間かな～☆
明日が楽しみだなー(*´ω｀*)
っていう時計を作ってみたんやけど...

「一日一日の時間を大切にせよ」と、
迫ってくるような時計になったねぇ😊

ブログ名の下あたりに設置してさ、
スクロールしても付いてくるようにしたら、
そりゃあもう、
このブログ嫌われそう😭

やってみたい人は↓を順番にどうぞ☆

※↓の手順では、ブログ名下うんぬんはできないよん。

1. ↓の「CSS」を「デザイン設定」＞「デザインCSS」にコピペ。
2. 新しい記事を作成する。
3. ↓の「コード」を「HTML編集」にコピペ。
4. 「プレビュー」で確認。
5. 完成！

CSS

#Watch{
display: inline-block;
width: 100%;
text-align: center;
font-weight:bold;
font-size:250%;
}

コード

<div>
<script>// <![CDATA[
function digs(num) {
return ( num < 10 )?num = "0" + num:num = num
}
function Watch() {
var date = new Date();
var nowHour = 23 - digs(date.getHours() );
var nowMin = digs(59 - date.getMinutes() );
var nowSec = digs(59 - date.getSeconds() );
var msg = nowHour + ":" + nowMin + ":" + nowSec;
document.getElementById("Watch").innerHTML = msg;
}
setInterval('Watch()',500);
// ]]></script>
</div>
<div id="Watch">00:00:00</div>